/** --------------------------------------
	file_name	: styles.css
	description	: main layout for kanal kampus okezone
	date		: Mar. 13, 2010
	
	author		: deni kurniawan
	mail		: deni.k77@gmail.com
	portfolio	: deniku.com
	
	main color	: (blue) #008ab8, (orange) #3ff7a00
	
-------------------------------------- **/

@import "forms.css";

/************ Elements styling ************/

.cls { clear: both; }		
.l { float: left; }			
.r { float: right; }
.txr { text-align:right; }

.mb10 { margin-bottom:10px; }
.mb15 { margin-bottom:15px; }
.mb20 { margin-bottom:20px; }
.mr16 { margin-right:16px; }
.mr20 { margin-right:20px; }
.p013 { padding:0 13px; }
.w940 { width:940px; }

.wrapper940 { width:940px; padding:0 13px; }
.wrapper626 { width:626px; }
.wrapper600 { width:600px; }
.wrapper300 { width:300px; }
.wrapper305 { width:305px; }
.wrapper290 { width:290px; }



.rounded, ul.nav li a {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	}
	
h1, h2, h4, h5, h6 {
	/* font-family: Helvetica, Arial, sans-serif; */
	color: #F90;
	font-weight: bold;
	letter-spacing:0.8pt;
	}
h1 { font-size: 28px; padding-bottom:5px; text-shadow:1px 1px 0 #FFF; line-height:32px; color:#C60; }
h2 { font-family:Arial; font-size: 22px; padding: 0; /*text-shadow:1px 1px 0 #333;*/ line-height:28px; margin-bottom:10px; }
h3 { font-size: 18px; padding: 0 0 10px 0; color:#333; }
h4 { font-size: 16px; padding: 0 0 5px 0; }
h5 { font-size: 12px; padding: 0 0 5px 0; }
h6 { font-size: 12px; padding: 0 0 5px 0; }

h2 a:link, h2 a:visited, h2 a:active { color:#09F; font-size: 22px; padding: 0;/*text-shadow:1px 1px 0 #FFF;*/ line-height:22px; }
h2 a:hover { color:#f68a28; }


a:focus { outline: 1px; }

a.orange { color: #f68a28; text-decoration: none; }
a.orange:hover { color: #09F; }
a.orange:active { color: #f68a28; }
a.orange:focus { outline: 1px; }

#nowshow .left a { color: #000; text-decoration: none; }
#nowshow .left a:hover { color: #FF0; }
#nowshow .left a:active { color: #FF0; }
#nowshow .left a:focus { outline: 1px; }

.oncehighlights a { color: #900; text-decoration: none; margin:0; font-size:10px; line-height:9px; }
.oncehighlights a:hover { color: #000; }
.oncehighlights a:active { color: #000; }
.oncehighlights a:focus { outline: 1px; }

.subjudul { color:#666; font-size:12px; }
.date { color:#999; margin-bottom:10px; }
.rsch { color:#090; margin-bottom:10px; }
.empty { text-align:center; color:#930; }
.l-oncemiddle p { text-align:justify; }
.r-oncemiddle p { text-align:justify; }

.imgthumb {
	float:left;
	margin-right:5px;
	margin-bottom:10px;
	border:#E9E9E9 1px dotted;
	padding:4px;
	}

/* ---       boxmenu       --- */
#boxmenu p a:link, #boxmenu p a:visited, #boxmenu p a:active { color:#999; text-decoration:none; }
#boxmenu p a:hover { color:#06C; }

/* Easy highlight_slider */

	#highlight_slider ul, #highlight_slider li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#highlight_slider, #highlight_slider li{ 
		/* 
			define width and height of container element and list item (slide)
			list items must be the same size as the highlight_slider area
		width:310px;
		height:197px;
		overflow:hidden;
		/*margin-top:2px;*/
		}
	#highlight_slider li{ 
		background:#afafaf;
		}		
	#highlight_slider li h2{ 
		margin:0 20px;
		padding-top:20px;
		}				
	span#prevBtn{}
	span#nextBtn{}					

/* // Easy highlight_slider */
	
/* ---       todays show       --- */
.todayshow {
	float:left;
	padding:0;
	width:310px;
}
.todayshow ul {
	list-style: none;
	margin:0;
	padding:0;
	border:none;
}
.todayshow ul li {
	margin:0px;
	padding:3px 0 4px;
	width:100%;
    font-size:1.0em;
}
.todaysshow-1 { background-color:#CCC; padding:5px;color:#999; width:340px;  }
.todaysshow-2 { background-color:#F0F0F0;padding:5px;  width:340px; }
.todaysshow-1  a{ color:#999;}
.todaysshow-2  a{ color:#999;}

.todayshow ul li a img {
	border:none;
	margin-bottom:-2px;
	margin-right:4px;
}
.todayshow ul li a {
	display:block;
	/*border-bottom:1px solid #e3e3e3;*/
	text-decoration:none;
	color:#333;
	padding:1px 5px;
}
.todayshow ul li a:hover, .todayshow ul li a:focus {
	color:#b60300;
}

.fullschedule a {
	text-decoration:none;
	background-color: #FF5604; color:#FFFFFF;
	padding:1px 5px;
}
/* ---       comments list       --- */
#cmntlist {
	float:left;
	padding:0px;
	margin-bottom:10px;
}
#cmntlist ul {
	list-style: none;
	margin:0;
	padding:0;
	border:none;
}
#cmntlist ul li {
	margin:7px 0;
	padding:10px;
	width:605px;
}
#cmntlist ul li p { }
#cmntlist .color1 { background-color:#EEE; }
#cmntlist .color2 { background-color:#CCC; }

/* ---       pagination       --- */
.pagging {
	float:right;
}
	.pagging a {
		float:left;
		display:block;
		cursor:pointer;
		color:#FFF;
		text-align:center;
		text-decoration:none;
		display:inline-block;
		border:1px solid #577b99;
		padding:2px 7px;
		margin:0 .38em 0 0;
		background:#375d7b url(../images/btnblue.jpg) top repeat-x;
	}
	.pagging a:hover {
		color:#FFF;
		background:#8fc1c9;
		border:1px solid #78a5ab;
	}
	.pagging a.sel {
		color:#FFF;
		font-weight:normal;
		background:#f0f7e8;
		cursor: default;
		border:1px solid #577B99;
		text-shadow:1px 1px 0 #B4611E;
		background: #8fc1c9 url('../images/btn-apply.jpg') top left repeat-x !important;
	}
	
.pagging-center {
	width:310px;
	float:left;
	text-align:center;
}
	.pagging-center-inner {}
	.pagging-center a {
		display:block;
		cursor:pointer;
		color:#FFF;
		text-align:center;
		text-decoration:none;
		display:inline-block;
		border:1px solid #FFF;
		padding:2px 8px;
		/*margin:0 .3em 0 0;*/
		background:#375d7b url(../images/btnblue.jpg) top repeat-x;
	}
	.pagging-center a:hover {
		color:#FFF;
		background:#8fc1c9;
		border:1px solid #FFF;
	}
	.pagging-center a.sel {
		color:#FFF;
		font-weight:normal;
		background:#f0f7e8;
		cursor: default;
		border:1px solid #FFF;
		text-shadow:1px 1px 0 #B4611E;
		/*margin:0 .3em 0 0;*/
		background: #8fc1c9 url('../images/btn-apply.jpg') top left repeat-x !important;
	}
	
	
/* @group Headline Scroller */
#scroller {
	width: 940px;
	height: 300px;
	float: right;
/*	margin-top: 2px; */
	background-color:#0066FF;
}
#scroller .overtext {
	z-index: 10;
	position: relative;
	bottom: 57px;
	width: 940px;
	height: 48px;
/*	background: url(images/trans.png) repeat; */
	background:#000000;
	filter:alpha(opacity=50);-moz-opacity:0.5;	-khtml-opacity: 0.5;opacity: 0.5;
	float: left;
	padding-top: 7px;
}
#scroller .overtext .odes {
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	width: 940px;
	padding-left: 10px;
	line-height: 17px;
	float: left;
}
#slideshow {
	margin-left: 0px;
}
pre code { background-color: #eee }

.pics { height: 300px; width: 940px; padding:0; margin:0; overflow: hidden }
.pics img { height: 300px; width: 940px; background-color: #eee; top:0; left:0;
	border-style: none;
}

#main { margin: 20px }

.snav {
	height: 24px;
}

.snav a span#prev {
	width: 14px;
	height: 27px;
	float: left;
	position: relative;
	top: -165px;
	background: url(../images/arrows_left.gif) no-repeat;
	text-indent: -5000px;
	left: 0px;
	z-index:5;
}

.snav a:hover span#prev {
	background-position: 0 -27px;
}

.snav a span#next {
	width: 14px;
	height: 27px;
	float: right;
	position: relative;
	top: -165px;
	background: url(../images/arrows_right.gif) no-repeat;
	text-indent: -5000px;
	right: 0px;
	z-index:5;
}

.snav a:hover span#next {
	background-position: 0 -27px;
}

/* @end */
	
	
.title_org { background:#ffa40d url(../images/title_orange.jpg) repeat-x; height:30px; width:310px; }
.title_red { background:#fe0606 url(../images/title_red.jpg) repeat-x; height:30px; width:310px; }
.title_pur { background:#7002f7 url(../images/title_purple.jpg) repeat-x; height:30px; width:310px; }



.btnsearch, .inputsearch {
	padding: 5px;
}
.inputsearch { width:198px; height:14px; color: #F0F0F0; border:none; background-color:#333 }
.btnsearch {
	display: inline-block;
	background: #333 url(../images/title_orange.jpg) top left repeat-x !important;
	border:none;
	padding: 4px 7px 4px 7px !important;
	color: #fff !important;
	font-size: 11px !important;
	cursor: pointer;
	font-weight:bold;
	}      
.btnsearch:hover {
	color:#333
	}       
.btnsearch:active {
	background0color:#CCC;
	}
	
	
	
/* tabs1 */
.shadetabs {
	border-bottom:2px solid #CCC;
	float:left;
	list-style-type:none;
	margin-bottom:10px;
	margin-left:0;
	margin-top:1px;
	padding:0;
	text-align:center;
	width:480px;
	}
.shadetabs li {
	display:inline;
	margin:0;
	}
.shadetabs li a {
	border:#CCC 1px solid;
	border-bottom:none;
	float:left;
	margin-right:1px;
	padding:7px;
	position:relative;
	text-decoration:none;
	z-index:1;
	margin-right:2px;
	font-size:14px;
	color:#CCC;
	
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-webkit-border-bottom-right-radius: 0px;
	-webkit-border-bottom-left-radius: 0px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	-moz-border-radius-bottomright: 0px;
	-moz-border-radius-bottomleft: 0px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 0px; 
	}
.shadetabs li a h3 { margin:0; padding:0; }
.shadetabs li a.selected {
	border:#CCC 1px solid;
	border-bottom:none;
	position:relative;
	background-color:#CCC;
	}
#tab-list {
	border:medium none;
	float:left;
	font-family:Verdana,Geneva,sans-serif;
	font-size:11px;
	margin-bottom:1em;
	padding:5px 0;
	width:520px;
	}	
	
	.mbottom a { color:#F78F1E}
.mbottom a:hover{ color:#FFF}
