@charset "utf-8";

/*=========================================================
	[ index.css ]
	Studio SPEC Pty. Ltd.
	date - creation:27,OCT,2010 // update:12,Nov,2010
=========================================================*/

/*=========================================================
	index
		1. import file
		2. Contents Layout style
		3. Main Contents style
		4. Side Contents style
=========================================================*/

/* for all */
@import "reset.css";
@import "layout.css";
/* for navigation */
@import "navigation.css";

/* 2. Countents Layout style
=========================================================*/
div#main{
	float: left;
	width: 457px;
}
div#subCon {
	float: right;
	width: 210px;
	margin-top: 15px;
}

/* 3. Main Contents style
=========================================================*/
/* Heading
---------------------------------------------------------*/
#main h2 {
	height: 20px;
	margin-top: 15px;
	margin-bottom: 1px;
	padding: 4px 0 0 5px;
	background: url(../images/index/ind_h2_bk_s.gif) no-repeat;
	font: normal 16px Impact, Charcoal;
	color: #dc8187;
	letter-spacing: 1px;
}
#main h2 a{color: #dc8187;}
#main h2 a:hover{color: #fff;text-decoration: none;}

/* Main Promotion images
=========================================================*/
.message {
	margin-bottom: 15px;
}

#flash {
	width: 687px;
	height: 220px;
	text-indent: -9999px;
	background: url(../images/promotion/mainFEB11.jpg) no-repeat;
}

#flash div#btn {
    float: right;  
    width: 135px;
	height: 44px;
	margin: 110px 25px 0 0;
}

#flash div#btn a{
	text-indent: -9999px;	
    display: block;
	width: 135px;
	height: 44px;
	background: url(../images/promotion/btn_detail.png) no-repeat;
}

#flash div#btn a:hover{
	background: url(../images/promotion/btn_detail_ov.png) no-repeat;
}


/* NEWS / TOPICS
---------------------------------------------------------*/
div#news{
	position: relative;
}
ul#articleList{
	position: relative;
	padding: 0;
	border-bottom: 1px solid #6b1d1d;
	background-color: #060412;
}
	#articleList li{
		width: 455px;
		border: 1px solid #6b1d1d;
		border-bottom: none;
		line-height: 2.5;
		background-repeat: no-repeat;
		background-position: 400px 10px;
	}
	#articleList li span{
		margin: 0 10px 0 10px;
		font-size: 10px;
		color: #dc8187;
	}
	#articleList li a{
		display: block;
		text-decoration: none;
	}
	
#articleList li a:hover{background:url(../images/index/ind_news_bk_ov.png) repeat-y left top;}
/* Category Icon */
#articleList li.news{background-image:url(../images/index/news_ico_news.gif);}
#articleList li.feature{background-image:url(../images/index/news_ico_feature.gif);}
#articleList li.event{background-image:url(../images/index/news_ico_event.gif);}
#articleList li.blog{background-image:url(../images/index/news_ico_blog.gif);}
#articleList li.sns{background-image:url(../images/index/news_ico_sns.gif);}

/*  PICK UP
---------------------------------------------------------*/
div#pickup{
	margin-top: 15px;
}

#pickup div {
	width: 210px;
	padding: 5px;
	border: 1px solid #6b1d1d;
	background:#060412 url(../images/common/con_box_corner.png) no-repeat 199px 3px;
}
	#pickup div.left {float: left;}
	#pickup div.right {float: right;}

	#pickup div .ttl {
		padding-bottom: 3px;
		color: #FFFFFF;
		font-size: .83em;
		line-height: 1.2;
		border-bottom: 1px solid #6b1d1d;
	}
	#pickup div .ttl a {color:#dc8187;}
	#pickup div span{color:#fff;font-size: 1.2em;}
	#pickup div a:hover {color:#FFFFFF;text-decoration: none;}

	#pickup div img{
		display: block;
		float: left;
		border: 1px solid #6b1d1d;
		margin-right: 8px;
	}
	#pickup div p {
		padding-top: 3px;
		font-size: .83em;
		line-height: 1.3;
	}

	#pickup .hover{background-color: #1d0210;}

/*  SDC CLASS SCHEDULE
---------------------------------------------------------*/
#sdcSchedule ul {
	position: relative;
	padding: 0;
	border-bottom: 1px solid #6b1d1d;
	background-color: #060412;
}
	#sdcSchedule li{
		width: auto;
		padding: 3px 5px 3px 30px;
		border: 1px solid #6b1d1d;
		border-bottom: none;
		background: url(../images/index/ind_classinfo_bk.png) no-repeat left top;
	}
	div.course{
		float: left;
		width: 340px;
		font-size: .83em;
		color: #dc8187;
	}
		.course p.name{
			margin: 2px 0;
			padding-bottom:3px;
			border-bottom: 1px dashed #6b1d1d;
			font-size: 1.2em;
			font-weight: bold;
			color: #fff;
		}
		div.supLink{
			float: right;
			font-size: .83em;
		}
		.supLink a{
			display: block;
			width: 70px;
			margin-bottom: 3px;
			padding: 2px;
			text-align: center;
			color: #c4c4c4;
			background-color: #6b6b6b;
		}
		.supLink a:hover{
			text-decoration: none;
			color: #fff;
			background-color: #dc8187;
		}
	#sdcSchedule li.hover{background: url(../images/index/ind_classinfo_bk_ov.png) no-repeat left top;}
	p.note{
		margin-top: 3px;
		font-size: .83em;
	}
	
	
/*  SDC CLASS TIMETABLE
---------------------------------------------------------*/
#sdcTimeTable {
	padding: 0 0 8px 0;
	border: 1px solid #6b1d1d;		
	background-color: #060412;
}
#sdcTimeTable p{
	clear: both;
	padding: 5px;
}

#sdcTimeTable p small{
	font-size: 11px;
}
#sdcTimeTable dl {
	margin: 8px 5px 5px 5px;
	}
#sdcTimeTable dl dt {
	float: left;
	margin-right: 3px;
	background:url(../images/index/ind_list_clock.png) no-repeat 0 50%;
	padding-left: 18px;
	font-size: 10px;
	min-height: 16px;
}

#sdcTimeTable dd {
	float: left;
    margin-right: 5px;
	font-weight: bold;
	font-size: 14px;
}

#sdcTimeTable dd.lastChild {
    margin-right: 0;
}
	
#sdcCalendar .blockContent{
	padding: 8px 0;
}
	
/* 4. Side Contents style
=========================================================*/
p#btnEnq{
	margin-bottom: 10px;
}
div#download{
	margin-bottom: 10px;
}
	#download p{margin-bottom: 5px;}




/* 5.mainslideshow
UNLESS YOU KNOW WHAT YOU'RE DOING, DO NOT CHANGE THE FOLLOWING RULES */
		
		.easy-accordion{display:block;position:relative;overflow:hidden;padding:0;margin:0}
		.easy-accordion dt,.easy-accordion dd{margin:0;padding:0}
		.easy-accordion dt,.easy-accordion dd{position:absolute}
		.easy-accordion dt{margin-bottom:0;margin-left:0;z-index:5;/* Safari */ -webkit-transform: rotate(-90deg); /* Firefox */ -moz-transform: rotate(-90deg);-moz-transform-origin: 20px 0px;  /* Internet Explorer */ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);cursor:pointer;}
		.easy-accordion dd{z-index:1;opacity:0;overflow:hidden}
		.easy-accordion dd.active{opacity:1;}
		.easy-accordion dd.no-more-active{z-index:2;opacity:1}
		.easy-accordion dd.active{z-index:3}
		.easy-accordion dd.plus{z-index:4}
		.easy-accordion .slide-number{position:absolute;bottom:0;left:10px;font-weight:normal;font-size:1.1em;/* Safari */ -webkit-transform: rotate(90deg); /* Firefox */ -moz-transform: rotate(90deg);  /* Internet Explorer */ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);}
		 
		 
		/* FEEL FREE TO CUSTOMIZE THE FOLLOWING RULES */
		
		dd p{line-height:120%}
		
		#accordion-1{width:687px;height:220px;}
		#accordion-1 dl{width:687px;height:220px}	
		#accordion-1 dt{height:46px;line-height:44px;text-align:right;padding:0 15px 0 0;font-size:1.1em;font-weight:bold;font-family: Tahoma, Geneva, sans-serif;text-transform:uppercase;letter-spacing:2px;
		background:url(../images/index/slide-title-inactive-1.png) no-repeat;}
		#accordion-1 dt.active{cursor:pointer;color:#fff;background:url(../images/index/slide-title-active-1.png) no-repeat;}
		#accordion-1 dt.hover{color:#fff;}
		#accordion-1 dt.active.hover{color:#fff}
		#accordion-1 dd{padding:20px;background:url(../images/index/slide.png) repeat-x; margin-right:3px; border-right:1px solid #dbe9ea;}
		#accordion-1 .slide-number{color:#DC8187;left:10px;font-weight:bold}
		#accordion-1 .active .slide-number{color:#fff;}
		#accordion-1 a{color:#DC8187}
		#accordion-1 dd img{float:right;margin:-20px 0 0 5px;}
		#accordion-1 dd p{color:#666; line-height: 1.3em;}		
		#accordion-1 h2{font-size:2.3em; line-height: 1.1em; margin-bottom: 10px; color:#333;}
		#accordion-1 h2 span{font-size:0.5em; margin-left: 10px; color:#C00;}
		#accordion-1 h2 small{font-size:0.5em; color:#C00;}		
		#accordion-1 p strong{ color: #C00;}
		#accordion-1 .more{width: 100px; height: 19px; line-height: 1.5em; background: url(../images/index/more.gif) no-repeat left 2px;display:block; overflow: hidden; padding-left: 10px; padding-top: 2px;margin-top: 10px;}
		#accordion-1 a.more { color: #C00; text-decoration:none;}
		#accordion-1 a:hover.more{width: 100px; height: 19px; background: url(../images/index/more.gif) no-repeat left -18px; color: #FFF;}
	
		/* for Image only */
		#accordion-1 dd.accBan{}
		#accordion-1 dd.accBan img{float: none;margin: -19px;}
		
/* MTwitter follw me
=========================================================*/
#twitter {
	position: absolute;
	top: 120px;
	right: 20px;
}
		
#fbBox {
	margin-top: 10px;
	margin-bottom: 10px;
}

.flexible{
	margin: 15px 0 0 0;
	text-align: center;
}
.flexible p{
	margin: 0 0 5px;
}
.flexible p span{
	font-size: 16px;
	font-weight: bold;
	color: #e10000;
}
.flexibleLink{
	font-size: 18px;
	font-weight: bold;
	margin: 0 0 25px !important;
}
.flexible p a{
display: block;
padding: 20px 0;
background: #E10000;
color: #fff;
/* Firefox v1.0+ */
-moz-border-radius:4px;
/* Safari v3.0+ and by Chrome v0.2+ */
-webkit-border-radius:4px;
/* Firefox v4.0+ , Safari v5.0+ , Chrome v4.0+ , Opera v10.5+  and by IE v9.0+ */
border-radius:4px;
border: solid 1px #e10000;
-moz-transition: all 0.4s linear 0;
-webkit-transition: all 0.4s linear 0;}
.flexible p a:hover{
	text-decoration: none;
	color: #e10000;
	background: #fff;
	border: solid 1px #e10000;}
}