@font-face{
	font-family:"4711_AtNoon_BigHead";
	src:url('4711_AtNoon_BigHead.eot');
	src:url('4711_AtNoon_BigHead.eot?#iefix') format('eot'),
	url('4711_AtNoon_BigHead.ttf') format('truetype'),
	url('4711_AtNoon_BigHead.woff') format('woff'),
	url('4711_AtNoon_BigHead.svg#4711_AtNoon_BigHead') format('svg');
}
@font-face{
	font-family:"4711_AtNoon_Regular";
	src:url('4711_AtNoon_Regular.eot');
	src:url('4711_AtNoon_Regular.eot?#iefix') format('eot'),
	url('4711_AtNoon_Regular.ttf') format('truetype'),
	url('4711_AtNoon_Regular.woff') format('woff'),
	url('4711_AtNoon_Regular.svg#4711_AtNoon_Regular') format('svg');
}
html { 
    filter: grayscale(1); 
}
body{
	font-family:tahoma, Arial;
	font-size:12px;
	color:#595959;
	margin:0;
	background-color:#CDCDCD;
}
a{
	text-decoration:none;
}
a:hover{
	text-decoration:underline;
}
img{
	border:none;
}
h1{
	font-family:"4711_AtNoon_BigHead";
	font-size:36px;
	color:#f84eae;
	margin:0;
}
.pink{
	color:#f40073;
}
.light-blue{
	color:#44b3f3;
}
.light-green{
	color:#2b9900;
}
.blue, .blue a{
	color:#0048ff;
	text-decoration:none;
}
.green, .green a{
	color:#266600;
	text-decoration:none;
}
.red, .red a{
	color:#ff0000;
	text-decoration:none;
}
.red a:hover, .blue a:hover, .green a:hover{
	color:#000000;
}
.head-black{
	font-family:"4711_AtNoon_Regular";
	font-size:24px;
	color:#343434;
}
.head-red{
	font-family:"4711_AtNoon_Regular";
	font-size:30px;
	color:#fe0000;
}
.head-green{
	font-family:"4711_AtNoon_Regular";
	font-size:26px;
	color:#00b716;
}
#head{
	width:1000px;
	height:562px;
	margin:auto;
	background-image:url(../images/template/head.jpg);
	border-bottom:solid 4px #6d6d6d;
}

/* Start menu*/
#menu{
	width:1000px;
	height:78px;
	margin:auto;
}
.menu1 a{
	width:97px;
	height:78px;
	float:left;
	background-image:url(../images/menu/menu-home.jpg);
}
.menu1 a:hover{
	background-image:url(../images/menu/menu-hover-home.jpg)
}
.menu2 a{
	width:89px;
	height:78px;
	float:left;
	background-image:url(../images/menu/menu-personal.jpg);
}
.menu2 a:hover{
	background-image:url(../images/menu/menu-hover-personal.jpg);
}
.menu3 a{
	width:97px;
	height:78px;
	float:left;
	background-image:url(../images/menu/menu-student.jpg);
}
.menu3 a:hover{
	background-image:url(../images/menu/menu-hover-student.jpg);
}
.menu4 a{
	width:156px;
	height:78px;
	float:left;
	background-image:url(../images/menu/menu-activity.jpg);
}
.menu4 a:hover{
	background-image:url(../images/menu/menu-hover-activity.jpg);
}
.menu5 a{
	width:164px;
	height:78px;
	float:left;
	background-image:url(../images/menu/menu-learning.jpg);
}
.menu5 a:hover{
	background-image:url(../images/menu/menu-hover-learning.jpg);
}
.menu6 a{
	width:130px;
	height:78px;
	float:left;
	background-image:url(../images/menu/menu-portfolio.jpg);
}
.menu6 a:hover{
	background-image:url(../images/menu/menu-hover-portfolio.jpg);
}
.menu7 a{
	width:120px;
	height:78px;
	float:left;
	background-image:url(../images/menu/menu-training.jpg);
}
.menu7 a:hover{
	background-image:url(../images/menu/menu-hover-training.jpg);
}
.menu8 a{
	width:147px;
	height:78px;
	float:left;
	background-image:url(../images/menu/menu-calendar.jpg);
}
.menu8 a:hover{
	background-image:url(../images/menu/menu-hover-calendar.jpg);
}
/* End menu */

#detail{
	width:1000px;
	height:auto;
	overflow:hidden;
	background-color:#FFF;
	margin:auto;
}
#left-side{
	width:195px;
	height:auto;
	overflow:hidden;
	margin:15px 0 30px 10px;
	float:left;
}
#right-side{
	width:750px;
	height:auto;
	overflow:hidden;
	float:right;
	margin:50px 15px 20px 0;
	line-height:18px;
}
#blog-gray{
	width:195px;
	height:auto;
	overflow:hidden;
	background-color:#e7e7e7;
	border-radius:10px;
	-webkit-border-radius:10px;
    -moz-border-radius:10px;
    -o-border-radius:10px;
	-ms-border-radius:10px;
	padding:15px 0;
	margin-bottom:10px;
	text-align:center;
}
#blog-gray img{
	border:solid 4px #FFF;
}
.blog-pink{
	width:195px;
	height:auto;
	overflow:hidden;
	background-color:#fb77c1;
	border-radius:10px;
	-webkit-border-radius:10px;
    -moz-border-radius:10px;
    -o-border-radius:10px;
	-ms-border-radius:10px;
	padding:5px 0;
	margin:10px 0;
}
ul.lmenu{
	padding:0;
	margin:0 0 0 8px;
	list-style:none;
}
ul.lmenu li{
	font-family:"4711_AtNoon_Regular";
	font-size:22px;
	color:#FFF;
	background:url(../images/template/arrow-icon.jpg) left 9px no-repeat;
	text-indent:20px;
}
ul.lmenu li a{
	color:#FFF;
	text-decoration:none;
}
ul.lmenu a:hover{
	color:#000;
}
.icon-schoolbus{
	width:95px;
	height:66px;
	float:right;
	background-image:url(../images/template/school-bus-icon.png);
	z-index:99;
	margin-bottom:-10px;
}
#foot{
	width:1000px;
	height:100px;
	padding:15px 0;
	background-color:#f84ead;
	margin:auto;
	text-align:center;
	color:#FFF;
	line-height:17px;
}
#foot a{
	color:#FFF;
	text-decoration:none;
}
#foot a:hover{
	color:#000;
}
#bg-welcome{
	width:671px;
	height:189px;
	background-image:url(../images/bg-welcome.jpg);
	padding:72px 0 0 42px;
	line-height:20px;
}
#topic-news{
	width:733px;
	height:58px;
	background-image:url(../images/topic-news.jpg);
	margin:30px 0;
}
#topic-news-teacher{
	width:733px;
	height:76px;
	background-image:url(../images/topic-news-teacher.jpg);
	margin:30px 0 20px 0;
}
#topic-news-student{
	width:733px;
	height:64px;
	background-image:url(../images/topic-news-student.jpg);
	margin:30px 0;
}
.row{
	width:750px;
	height:auto;
	overflow:hidden;
	margin-bottom:20px;
}
.column{
	width:355px;
	height:auto;
	margin:0 10px;
	float:left;
}
.column img{
	float:left;
	margin:0 15px 15px 0;
}
.border-pink{
	border:solid 3px #ffd3ea;
}
.border-blue{
	border:solid 3px #cbf8ff;
}
.border-green{
	border:solid 3px #ddfc9a;
}
.img-right{
	float:right;
	margin:0 0 15px 15px;
}
.top-space{
	margin-top:30px;
}
.blog-news{
	width:750px;
	height:auto;
	overflow:hidden;
	padding:10px 0;
	border-bottom:dashed 1px #a8a8a8;
}
.blog-news img{
	float:left;
	margin:0 15px 15px 0;
}
.blog-detail{
	width:700px;
	height:auto;
	overflow:hidden;
	padding:20px;
	background-color:#f6f6f6;
	border-radius:10px;
	-webkit-border-radius:10px;
    -moz-border-radius:10px;
    -o-border-radius:10px;
	-ms-border-radius:10px;
}
table.chart {
	margin:0;
}
table.chart th{
	border-bottom:solid 2px #ffb2dd;
	background-color:#ffe7f5;
	color:#000;
	font-weight:bold;
	text-align:center;
	padding:10px 0;
}
table.chart tr{
	background:url(../images/arrow-icon.png) left 13px no-repeat;
}
table.chart tr:hover{
	background-color:#fff3fa;
	border-bottom:dashed 1px #f84eae;
}
table.chart td:hover{
	border-bottom:dashed 1px #f84eae;
}
table.chart td{
 	border-bottom:dashed 1px #e5e5e5;
 	padding:10px 0 10px 35px;
}
table.tb {
	border-top: solid 1px #777777;
 	border-left:solid 1px #777777;
}
table.tb td{
 	border-bottom:solid 1px #777777;
	border-right:solid 1px #777777;
	padding:5px;
}
.blog300{
	width:325px;
	height:auto;
	overflow:hidden;
	text-align:center;
	margin:20px 25px;
	float:left;
}
.blog250{
	width:250px;
	float:left;
	text-align:center;
	margin-top:20px;
}