* /* For CSS Reset */

{
	padding: 0;
	margin: 0;
}

html, body
{
	width: 100%;
	height: 100%;
}

div#wrapper
{
	width: 100%;
	height: 100%;
	min-height: 100%; /* For Sticky Footer */
	height: auto !important; /* For Sticky Footer */
	margin: 0 auto -170px; /* For Sticky Footer */
	background-image:url(images/bg-web.png)
}

div#topmenu
{
	height:40px;
	width:960px;
	float:left;
	text-align:center;
	min-width:100%;
	margin-left:auto;
	margin-right:auto;
	background-color:#069;
	z-index:100;
}

/* dropdown menu nav */
#topmenu ul {
  text-align: left;
  display: inline;
  margin-left: 70px;
  padding: 0;
  list-style: none;
  /*-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);*/
  z-index:100;
  color:#EEE;
}

#topmenu ul li {
  font:  13px bold  Verdana, Geneva, sans-serif;
  font-size-adjust:inherit;
  display: inline-block;
  margin-right: -5px;
  margin-top:0px;
  position: relative;
  padding: 11px 15px;
  background: #069;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  z-index:110;
}

#topmenu ul li a {
	color: #FFF;
	text-decoration: none;
}

#topmenu ul li:hover {
  background: #09C;
  color: #FFF;
}

#topmenu ul li ul {
  padding: 0;
  position: absolute;
  top: 40px;
  left: 0;
  width: 200px;
  display: none;
  opacity: 0;
  visibility: hidden;
  -webkit-transiton: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  -transition: opacity 0.52;
  z-index:120;
}

#topmenu ul li ul li { 
	background:url(images/top_menu_trans_bg.png);
  	/*background: #09C; */
  	display: block; 
  	color: #FFF;
  	z-index:130;
	height:35px;
	padding:10px 10px;
  	margin-left:-70px;
}

#topmenu ul li ul li a {
	color: #FFF;
	text-decoration: none;
}

#topmenu ul li ul li a:hover {
	color: #fff;
	text-decoration: none;
}

#topmenu ul li ul li:hover { 
	background: #069; 
	color:#fff;
}

#topmenu ul li:hover ul {
  display: block;
  opacity: 1;
  visibility: visible;
}

div#header
{
	width: 100%;
	height: 110px;
	background:url(images/header_bg.png) repeat-x;
	text-align: center;
}

div#header_inner
{
	width:960px;
	background:url(images/gmis_header.png) no-repeat;
	height:110px;
	margin:0 auto;
}

.logo
{
	float:left;
	width:95px;
	height:125px;
	text-align:center;
	position:absolute;
	margin-left:30px;
	z-index:10000;
}

.gmis
{
	float:left;
	width:780px;
	height:70px;
	text-align:center;
	position:absolute;
	margin-left:155px;
	margin-top:20px;
	z-index:9;
}

/* Essential slider functionality (never changes) */
	.plusslider { overflow: hidden; position: relative; text-align: center; }
	.plusslider-container { position: relative; }
	.plusslider .child { float: left; }
	.plustype-fader .child { display: none; position: absolute; left: 0; top: 0; } /* only applies to fader type (not slider) */
	.plustype-fader .current { z-index: 5; } /* only applies to fader type (not slider) */
	.plusslider a img { border: none; } /* prevent blue borders in IE, which break "slider" type by altering the spacing */

	
/* No-javascript fallback (change "#slider1" selectors below to suit your html) */
	#slider1 > * { display: none; }
	#slider1 > *:first-child { display: block; }


/* Position the nav arrows & pagination controls */
	
	.plusslider-arrows .prev {
		/* place "prev" arrow to the left of the slider */
		position: absolute;
		top: 40%;
		left: 0;
		z-index: 6;
	}
	
	.plusslider-arrows .next {
		/* place "next" arrow to the right of the slider */
		position: absolute;
		top: 40%;
		right: 0;
		z-index: 6;
	}
	
	.plusslider-pagination-wrapper {
		/* place the pagination controls over the bottom-center of the slider */
		position: absolute;
		z-index: 6; /* ensure this appears "in front" of the slider */
		bottom: 10px;
		left: 50%; /* center horizontally (works with child's "position:relative; left:-50%;") */
	}
	
	.plusslider-pagination {
		/* center horizontally (works with parent's "position:absolute; left:50%;" -- see http://stackoverflow.com/a/1777282/477513 ) */
		position: relative;
		left: -50%;
	}


/* Style the nav arrows & pagination controls */
	.plusslider-arrows,
	.plusslider-pagination {
		/* reset default list styles */
		list-style: none;
		margin: 0;
		padding: 0;
	}
	
	.plusslider-arrows li {
		/* make these look like basic buttons, and make them clearly visible over the slides */
		margin: 5px;
		padding: 5px;
		text-align: center;
		border: 1px solid black;
		background-color: white;
		cursor: pointer;
	}
	
	.plusslider-pagination li {
		/* line these up in a row and make them clearly visible over the slides */
		float: left;
		margin-left: 5px;
		padding: 5px;
		background-color: white;
		cursor: pointer;
	}


/* Slide width/height (required for non-image slides) */
	.plusslider .child {
		min-width: 100%;
		min-width: 960px;
		height: auto;
		max-height: 360px;
		background-image:url(images/note_paper_bg.jpg);
		background-color:#E8DEC3;
	}


/* Reponsive! (Here for demo purposes -- it is assumed that responsive styles would already exist in your site-wide CSS) */
	#slider1 {
		width: 50%;
	}

	.child img {
		max-width: 100%;
		width:auto;
		height: auto;
		overflow:hidden;
	}

div#homemenu
{
	width: 100%;
	height: 80px;
	background-color:#fff;
	text-align: center;
}

div#content
{
	width: 960px;
	margin: 0 auto;
	text-align: center;
	color: #fff;
	font-family:Verdana, Geneva, sans-serif;
	
}

div#content h4
{
	/*nambah baru*/
	font-family: Verdana, Geneva, sans-serif; font-size: 24px; font-style: normal; font-variant: normal; font-weight: 700; line-height: 26.4px; } h3 { font-family: Verdana, Geneva, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: 700; line-height: 15.4px; } p { font-family: Verdana, Geneva, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 20px; } blockquote { font-family: Verdana, Geneva, sans-serif; font-size: 21px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 30px; } pre { font-family: Verdana, Geneva, sans-serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 18.5714px;

}





div#news
{
	width: 230px;
	text-align: left;
	float: left;
	padding: 30px;
}

div#news h1
{
	font-family:Verdana, Geneva, sans-serif;
	font-size:1.5em;
	color:#39C;
	padding-bottom:15px;
}


div#news h2
{
	font-family:Verdana, Geneva, sans-serif;
	font-size:1.2em;
	color:#C66;
	padding-bottom:5px;
	padding-top:15px;
}

div#news p
{
	font-family:Verdana, Geneva, sans-serif;
	font-size:0.9em;
	color:#fff;
}

div#news a:link, a:visited {
	color: #39C;
	text-decoration: none;
}
div#news a:hover, a:active {
	/*background-color: #FDEFE1; */
	color: #FC3;
}

div#submenu
{
	width: 230px;
	text-align: left;
	float: left;
	padding: 30px;
}

div#submenu h1
{
	font-family:Verdana, Geneva, sans-serif;
	font-size:1.5em;
	color:#39C;
	padding-bottom:10px;
}

.arrowlistmenu {
width: 220px; /*width of menu*/
}

.arrowlistmenu ul {
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 8px; /*bottom spacing between each UL and rest of content*/
}

.arrowlistmenu ul li {
padding-bottom: 0px; /*bottom spacing between menu items*/
}

.arrowlistmenu ul li a {
background: url(images/arrowbullet.png) no-repeat center left; /*custom bullet list image*/
display: block;
padding: 8px 0;
padding-left: 23px; /*link text is indented 20px*/
text-decoration: none;
font-family:Verdana, Geneva, sans-serif;
font-size:0.9em;
color:#fff;
font-weight:normal;
border-bottom: 1px solid #dadada;
}

.arrowlistmenu ul li a:visited {
color: #666;
}

.arrowlistmenu ul li a:hover { /*hover state CSS*/
color: #39C;
}

div.clear_floats /* For Clearing Floats */
{
	clear: both;
}

div#maincontent
{
	width:609px;
	padding:5px 30px 10px 30px;
	margin-top:25px;
	margin-bottom:50px;
	border-left:1px solid #CCC;
	float:right;
	text-align:left;
	
}

div#maincontent p
{
	font-family:Verdana, Geneva, sans-serif;
	font-size:1.0em;
	color:#fff;
	line-height:21px;
}

div#maincontent ul li
{
	font-family:Verdana, Geneva, sans-serif;
	font-size:1.0em;
	color:#fff;
	line-height:21px;
	margin-left:15px;
	list-style-type:circle;
}

div#maincontent ol li
{
	font-family:Verdana, Geneva, sans-serif;
	font-size:1.0em;
	color:#fff;
	line-height:21px;
	margin-left:22px;
}

div#maincontent .lidua
{
	margin-left:38px;
	color: #fff;
}

div#maincontent .redtext
{
	color:#FFF;
}

div#maincontent h1
{
	font-family:Verdana, Geneva, sans-serif;
	font-size:1.5em;
	color:#FFF;
	padding-bottom:15px;
}

div#maincontent h2
{
	font-family:Verdana, Geneva, sans-serif;
	font-size:1.2em;
	color:#fff;
	padding-bottom:15px;
}

div#maincontent a {
	color:#09C;
	text-decoration:none;
}

div#maincontent a:hover {
	color:#09C;
	text-decoration:underline;
}

div#borderbottom {
	width:100%;
	height:1px;
	border-bottom:1px dashed #999;
	margin-top:20px;
	margin-bottom:20px;
}

#housesystem
{
	width: 600px;
	text-align: left;
	border-collapse: collapse;	
}

#housesystem td
{
	padding: 8px 8px 8px 0px;
	/*border-top: 1px dashed #CCC;*/
}

#housesystem2
{
	width: 600px;
	text-align: left;
	border-collapse: collapse;	
}

#housesystem2 td
{
	padding: 20px 10px 10px 10px;
}

#cocurricular
{
	font-family:Verdana, Geneva, sans-serif;
	font-size:1.0em;
	color:#fff;
	line-height:21px;
	width: 550px;
	text-align: left;
	border-collapse: collapse;	
}

#cocurricular td
{
	padding: 0px 8px 8px 0px
}

#cocurricular .left
{
	padding: 0px 8px 8px 0px;
	border-right:1px dashed #CCC;
}

#cocurricular .right
{
	padding: 0px 8px 8px 30px;
}

#subjectgroup
{
	width: 600px;
	border-collapse: collapse;
	font-family:Verdana, Geneva, sans-serif;
	font-size:1.0em;
	color:#333;
	line-height:21px;	
}

#subjectgroup th
{
	padding: 10px 10px 10px 10px;
	background-color:#FFF;
	text-align:center;
}

#subjectgroup td
{
	padding: 10px 10px 10px 10px;
	border-bottom: 1px dashed #C96;
	text-align: left;
	color: #fff;
	background-color:#616161;
}

#subjectgmis
{
	width: 600px;
	border-collapse: collapse;
	font-family:Verdana, Geneva, sans-serif;
	font-style:normal;
	font-size:14px;
	color:#333;
	line-height:21px;	
}

#subjectgmis th
{
	padding: 10px 10px 10px 10px;
	background-color:#6CF;
	text-align:center;
}

#subjectgmis td
{
	padding: 10px 10px 10px 10px;
	text-align: left;
	background-color:#d7f8ff;
}

#subjectgmis .left
{
	padding: 10px 10px 10px 10px;
	border-right:1px dashed #6CF;
	
}

#subjectgmis .right
{
	padding: 10px 10px 10px 15px;
}

#hor-zebra
{
	font-family:Verdana, Geneva, sans-serif;
	font-size: 1.0em;
	width: 600px;
	text-align: left;
	border-collapse: collapse;
}
#hor-zebra th
{
	font-weight: normal;
	padding: 10px 8px;
	color: #036;
	background-color:#fff;
}
#hor-zebra td
{
	padding: 8px;
}
#hor-zebra .odd
{
	background: #333; 
}

#hor-zebra .even
{
	background: #616161; 
}

#ver-zebra
{
	font-family: Verdana, Geneva, sans-serif;
	font-size: 14px;
	margin-bottom:10px;
	width: 99%;
	text-align: center;
	border-collapse: collapse;
}
#ver-zebra th
{
	font-size: 14px;
	font-weight: normal;
	padding: 15px 15px;
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	color: #039;
	vertical-align:text-top;
}
#ver-zebra td
{
	padding: 10px 15px;
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	border-bottom: 1px solid #fff;
	color: #669;
}
.vzebra-odd
{
	background: #eff2ff;
}
.vzebra-even
{
	background: #e8edff;
}
#ver-zebra #vzebra-adventure, #ver-zebra #vzebra-children
{
	background: #d0dafd;
	border-top: 1px solid #6e83cf;
	border-bottom: 1px solid #6e83cf;
}
#ver-zebra #vzebra-comedy, #ver-zebra #vzebra-action
{
	background: #dce4ff;
	border-top: 1px solid #6e83cf;
	border-bottom: 1px solid #6e83cf;
}

.tablebottom {border-bottom: 1px dashed #CCC;}

blockquote {
    width: 90%;
    padding: 20px;
	background-color:#006699;
    text-align: left;
}

div#footer
{
	width: 100%;
	height: 170px;
}

div#bottommenu
{
	width:960px;
	height:120px;
	margin:auto;
	background:url(images/bottom_menu_bg.png) no-repeat;
}

div#logofooter
{
	margin-left:290px;
	margin-top:21px;
	padding-left:25px;
	float:left;
	border-left:1px solid #CCC;
}

div#social
{
	margin-left:-300px;
	margin-top:22px;
	padding-right:30px;
	font-family:Verdana, Geneva, sans-serif;
	font-size:0.8em;
	color:#666;
	line-height:18px;
	float:left;
}

div#contactus
{
	margin-left:20px;
	margin-top:22px;
	padding-right:30px;
	font-family:Verdana, Geneva, sans-serif;
	font-size:0.8em;
	color:#666;
	line-height:18px;
	float:left;
	border-right:1px solid #CCC;
}

div#contactdetails
{
	margin-left:710px;
	padding-top:22px;
	font-family:Verdana, Geneva, sans-serif;
	font-size:0.8em;
	color:#666;
	line-height:18px;
}

div#copyright
{
	width: 100%;
	height: 32px;
	background-color: #606060;
	text-align: center;
	color:#fff;
	font-family:Verdana, Geneva, sans-serif;
	font-size:x-small;
	letter-spacing:0.05em;
	padding-top:18px;
}

#copyright a {
	text-decoration:none;
	color:#999999;
}

#copyright a:hover {
	text-decoration:none;
	color:#FFCC00;
}

div.push /* For Sticky Footer */
{
	height: 170px;
}