@charset "utf-8";
/* CSS Document */
html {height: 100%;}

body {
	font-family:tahoma, arial, sans-serif;
	font-size:13px;
	text-align:left;
	color:#000;
	background:#e86e23;	
	width:960px;
	height:auto;
	vertical-align:middle !important;
	margin:auto;
	vertical-align:middle;
	padding:10px;
	background-position:top center;	
}


* {
    box-sizing: border-box;
}


table#lawa {
	
    background-color:#FFFFFF;
    border: solid #839E99 1px;
/*	font: .9em/1.2em Georgia, "Times New Roman", Times, serif; color: #033; */
	font: 1em/1.2em tahoma, "Times New Roman", Times, serif; color: #033; 
}
table#lawa td {
   border:  solid #839E99 1px;
}
table#lawa tr {
	height:30px;
}
table#lawa th {
    border: solid #839E99 1px;
	background: #8dc63f;
	text-align:center;
	font-weight:bold;
}
table#lawanoborder {
	
    background-color:#FFFFFF;
    border: solid #839E99 1px;
	font: 1em/1.2em tahoma, "Times New Roman", Times, serif; color: #033; 
}
table#lawanoborder td {
/*   border:  solid #839E99 1px;*/
}
table#lawanoborder tr {
	height:30px;
}
table#lawanoborder th {
    border: solid #839E99 1px;
	background: #8dc63f;
	text-align:center;
/*	font-weight:bold;*/
}
/*table {
	
}
td {
	vertical-align:middle;
	padding:2px;
}
th {
	font-size:14px;
	text-align:center;
}
thead th {
	font-size:13px;
	padding:8px;
	text-transform:uppercase;
	letter-spacing: 2px;
}*/
fieldset { padding-top:10px; padding-bottom:20px; width:960px; }
.banner{
	margin:auto;
	width:100%;
	height:80px;
	/*background-image:url(../../media/images/banner.gif);*/
	background-repeat:no-repeat;
	float:center;
	display:block;	
	background-position:top center;	
}
input,select, textfield { 
	border:1px solid #d1c7ac;
	color:#333333;
	padding:3px;
	margin-right:4px;
	margin-bottom:4px;
	font: 1em/1.2em tahoma, "Times New Roman", Times, serif; color: #033; 
}
textarea{ 
	border:1px solid #d1c7ac;
	color:#333333;
	padding:3px;
	margin-right:4px;
	margin-bottom:4px;
	font: 1em/1.2em tahoma, "Times New Roman", Times, serif; color: #033; 
}
#button {
	/*font: .9em/1.2em Georgia, "Times New Roman", Times, serif; color: #FFF; */
	font-size:12px;
	color: #FFF;
	height:25px;
	width:100px;
	background:#666;
	border:#FFFFFF;
}
#button:hover{
border-color:#F60;
}
#footer {
	/*background:#93F;*/
	background:#0CF;
	color:#000;
	padding-bottom:inherit;
	padding-top:inherit;
}

.header{
	margin:auto;
	width:960px;
	background:url(../../media/images/menu.gif) no-repeat; 
	background-repeat:no-repeat;
	background-position:top center;	
	float:center;
	color:#FFF;
	height:25px;
	vertical-align:middle !important;	
	vertical-align:middle;
	text-align:center;
	padding:10px;
	font-size:14px;
	font-weight:bold;
	/*background-color:#6e899b;  /*275305 kaler header ------------------------------------------------------------------------*/
}

.menu_atas{
/*	color:#FFF;*/
/*	background:url(../../media/images/bgb.png) repeat-x top; */
	height:auto;
	vertical-align:middle !important;
	width:960px;
/*	width:100%;*/
	margin:auto;
	vertical-align:middle;
	text-align:center;
	padding:10px;
/*	font-size:13px;*/
	font-weight:bold;
/*	background-color:#CCC;*/
	background-color:#bacad4;  kaler BG menu ------------------------------------------------------------------------*/
}
.footer{
	/*background:url(../../media/images/menu.gif) no-repeat; */
	background-repeat:no-repeat;
	background-position:top center;	
	color:#FFF;
	height:50px;
	vertical-align:middle !important;
	width:960px;
/*	width:100%;*/
	margin:auto;
	vertical-align:middle;
	text-align:center;
	padding:10px;
	font-size:11px;
	font-weight:bold;
/*	width:960px;*/
/*	background-color:#535e66; /*kaler footer ---------------------------------------------------------------------------*/
}
.container{
	min-width:980px;
	height:auto;
	margin:auto;
	min-height:400px;
}
.shadetabs{
	padding: 0px;
	padding-top:0px;
	margin:auto;
/*	font: bold 11px Verdana;*/
	text-align: center;
}
.shadetabs li{
	margin: 0 10px;
	padding: 0 0 3px;
	float: left;
	position: relative;
	list-style: none;
/*	color:#CCC;*/
}
.shadetabs li a{
	text-decoration: none;
	color:#fff;
	position: relative;
	z-index: 1;
	padding: 5px 5px;
	margin-right: 0px;
	border: 0px solid #778;
	background-color:#408f03;	 /*kaler menu ----------------------------------------------------------------------------*/
	-moz-border-radius-topright:5px;
	-moz-border-radius-topleft:5px;
	-webkit-border-top-left-radius:5px;
	-webkit-border-top-right-radius:5px;
	border-top-left-radius:5px;
	border-top-right-radius:5px;
}
.shadetabs li a:visited{
	
}



.shadetabs li a:hover{
	background:#98de62;      /*kaler menu ------------------------------------------------------------------------*/
	color:#275305;			/*kaler tulisan menu ------------------------------------------------------------------*/
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
.shadetabs li .submenu li, .shadetabs li .submenu li a{
	text-decoration: none;
	position: relative;
	z-index: 100;
	padding: 5px 5px;
	margin-right: 0px;
	display:block;
	float:none;
	background:#fdd023;
	color:#000;
	text-align:justify;
	
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

.box_utama{
	padding-top: 10px;
	background-image: url("../../media/images/BG.png");
	background-position: center; /* Center the image */
 	background-repeat: no-repeat; /* Do not repeat the image */
	width: 960px;
	height: 720px;
	
}

.box_rc{
	padding-top: 10px;
	background-image: url("../../media/images/BG_RC.png");
	background-position: center; /* Center the image */
 	background-repeat: no-repeat; /* Do not repeat the image */
	width: 960px;
	height: 720px;
}

.box_mc{
	padding-top: 10px;
	background-image: url("../../media/images/BG_MC.png");
	background-position: center; /* Center the image */
 	background-repeat: no-repeat; /* Do not repeat the image */
	width: 960px;
	height: 720px;
}

.menu_utama{	
	padding-top: 110px;
	padding-right: 200px;
	margin-top:40px;
}

.menu_rc{	
	padding-top: 110px;
	padding-right: 200px;
	margin-top:40px;
}

.menu_mc{	
	padding-top: 110px;
	padding-right: 200px;
	margin-top:40px;
}

.kotak{	
	width: 550px;
	margin-left:105px;
}

.semak{	
	padding-left: 100px;
}

.jadual{
	width: 960px;
	padding-top: 20px;
	padding-bottom: 50px;
	background-color: #e86e23;
}



.calendar {
    display: flex;
    flex-flow: column;
}
.calendar .header .month-year {
    font-size: 20px;
    font-weight: bold;
    color: #636e73;
    padding: 20px 0;
}
.calendar .days {
    display: flex;
    flex-flow: wrap;
}
.calendar .days .day_name {
    width: calc(100% / 7);
    border-right: 1px solid #8dc63f;
    padding: 20px;
	text-align: center;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: bold;
    color: #818589;
    color: #fff;
    background-color: #407103;
}
.calendar .days .day_name:nth-child(7) {
    border: none;
}
.calendar .days .day_num {
    display: flex;
    flex-flow: column;
    width: calc(100% / 7);
    border-right: 1px solid #e6e9ea;
    border-bottom: 1px solid #e6e9ea;
    padding: 15px;
    font-weight: bold;
    color: #000000;
    cursor: pointer;
    min-height: 100px;
	background-color: #fcfdb8;
}
.calendar .days .day_num span {
    display: inline-flex;
    width: 30px;
    font-size: 14px;
}
.calendar .days .day_num .event {
    margin-top: 10px;
    font-weight: 500;
    font-size: 14px;
    padding: 3px 6px;
    border-radius: 4px;
    /*background-color: #e98d03;*/
    color: #fff;
	font-weight: bold;
    word-wrap: break-word;
}
.calendar .days .day_num .event.green {
    background-color: #327108;
}
.calendar .days .day_num .event.blue {
    background-color: #4c34c9;
}
.calendar .days .day_num .event.orange {
    background-color: #e98d03;
}
.calendar .days .day_num .event.turquies {
    background-color: #06957f;
}
.calendar .days .day_num .event.purple {
    background-color: #6f34ac;
}
.calendar .days .day_num .event.red {
    background-color: #aa1613;
}
.calendar .days .day_num:nth-child(7n+1) {
    border-left: 1px solid #e6e9ea;
	background-color: #fdb59d;
	cursor: inherit;
}
.calendar .days .day_num:nth-child(7n) {
    border-left: 1px solid #e6e9ea;
	background-color: #fdb59d;
	cursor: inherit;
}
.calendar .days .day_num:hover {
    /*background-color: #fdfdfd;*/
	cursor: inherit;
}
.calendar .days .day_num.ignore {
    background-color: #b0d8f7;
    color: #6d7699;
    cursor: inherit;
}
.calendar .days .day_num.selected {
    background-color: #b7e37c;
    /*cursor: inherit;*/
}

.navtop {
    background-color: #3b4656;
    height: 60px;
    width: 100%;
    border: 0;
}
.navtop div {
    display: flex;
    margin: 0 auto;
    width: 800px;
    height: 100%;
}
.navtop div h1, .navtop div a {
    display: inline-flex;
    align-items: center;
}
.navtop div h1 {
    flex: 1;
    font-size: 24px;
    padding: 0;
    margin: 0;
    color: #ebedee;
    font-weight: normal;
}
.navtop div a {
    padding: 0 20px;
    text-decoration: none;
    color: #c4c8cc;
    font-weight: bold;
}
.navtop div a i {
    padding: 2px 8px 0 0;
}
.navtop div a:hover {
    color: #ebedee;
}

.content {
    width: 960px;
    margin: 0 auto;
}
.content h2 {
    margin: 0;
    padding: 25px 0;
    font-size: 22px;
    border-bottom: 1px solid #ebebeb;
    color: #666666;
}

div.gallery {
  border: 1px solid #ccc;
}

div.gallery:hover {
  border: 1px solid #777;
}

div.gallery img {
  width: 100%;
  height: auto;
}

div.desc {
  padding: 15px;
  text-align: center;
}

* {
  box-sizing: border-box;
}

.responsive {
  padding: 0 6px;
  float: left;
  width: 20%;
  height: 300px;
}

@media only screen and (max-width: 700px) {
  .responsive {
    width: 49.99999%;
    margin: 6px 0;
  }
}

@media only screen and (max-width: 500px) {
  .responsive {
    width: 100%;
  }
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}