@charset "utf-8";
body { margin:0; padding:0; width:100%; background:#1d1d1d url(images/main_bg.gif) top repeat-x;}
html { padding:0; margin:0;}

/* main */
.main {width:100%; padding:0; margin:0 auto; }
.resize { width:955px; margin:0 auto;}

/********** header **********/
.header { }

.block_header {margin:0 auto; width:980px; }
.top_menu { float:right; padding:4px 10px; font:normal 14px Calibri, Tahoma, Arial; color:#4e4e4e; line-height:1.6em;}
.top_menu a { font:normal 11px Tahoma, Geneva, sans-serif; color:#4e4e4e; text-decoration:none;}
.top_menu a:hover {text-decoration:underline;}

/* logo */
.logo { float:left; padding:0; margin:40px 0 0 10px; width:350px;}
/*****chat*/
.chat { width:380px; float:right; margin:0px 0px 0 0px; padding:0;}
.chat img { float:left; margin:10px 0 0 0; padding:0;}
.chat p { width:260px; float:right; background:#0b0d0d; color:#949596; font:normal 14px Calibri, Tahoma, Arial; border:1px solid #182a30; padding:2px 5px;}
/********** slider **********/
.slider {background:url(images/slimple_bg.gif) top no-repeat; margin:20px auto; padding:0; height:220px;}
.sliderat {background: url(images/sliser_a.gif) top no-repeat; margin:20px auto; padding:0; height:165px; width:963px;}
.sliderdocument {background: url(images/sliser_document.gif) top no-repeat; margin:20px auto; padding:0; height:165px; width:963px;}
.slidergive {background: url(images/sliser_give.gif) top no-repeat; margin:20px auto; padding:0; height:165px; width:963px;}
.sliderglobe {background: url(images/sliser_globe.gif) top no-repeat; margin:20px auto; padding:0; height:165px; width:963px;}
.sliderhammer {background: url(images/sliser_hammer.gif) top no-repeat; margin:20px auto; padding:0; height:165px; width:963px;}
.sliderinfo {background: url(images/sliser_info.gif) top no-repeat; margin:20px auto; padding:0; height:165px; width:963px;}
.slidermail {background: url(images/sliser_mail.gif) top no-repeat; margin:20px auto; padding:0; height:165px; width:963px;}
.sliderpeople {background: url(images/sliser_people.gif) top no-repeat; margin:20px auto; padding:0; height:165px; width:963px;}
.sliderperson {background: url(images/sliser_person.gif) top no-repeat; margin:20px auto; padding:0; height:165px; width:963px;}
.sliderquestion {background: url(images/sliser_question.gif) top no-repeat; margin:20px auto; padding:0; height:165px; width:963px;}
.sliderccfhkids {background: url(images/sliser_ccfhkids.gif) top no-repeat; margin:20px auto; padding:0; height:165px; width:963px;}
.sliderhighschool {background: url(images/sliser_high_school.gif) top no-repeat; margin:20px auto; padding:0; height:165px; width:963px;}
.sliderat h2 { width:500px; font:bold 30px  Calibri, Tahoma, Arial; color:#fff; margin:0; padding:60px 0 10px 30px; line-height:1.2em;}
.sliderat h2 span { color:#b9efff;}
.sliderdocument h2 { width:500px; font:bold 30px  Calibri, Tahoma, Arial; color:#fff; margin:0; padding:60px 0 10px 30px; line-height:1.2em;}
.sliderdocument h2 span { color:#b9efff;}
.slidergive h2 { width:500px; font:bold 30px  Calibri, Tahoma, Arial; color:#fff; margin:0; padding:60px 0 10px 30px; line-height:1.2em;}
.slidergive h2 span { color:#b9efff;}
.sliderglobe h2 { width:500px; font:bold 30px  Calibri, Tahoma, Arial; color:#fff; margin:0; padding:60px 0 10px 30px; line-height:1.2em;}
.sliderglobe h2 span { color:#b9efff;}
.sliderhammer h2 { width:500px; font:bold 30px  Calibri, Tahoma, Arial; color:#fff; margin:0; padding:60px 0 10px 30px; line-height:1.2em;}
.sliderhammer h2 span { color:#b9efff;}
.sliderinfo h2 { width:500px; font:bold 30px  Calibri, Tahoma, Arial; color:#fff; margin:0; padding:60px 0 10px 30px; line-height:1.2em;}
.sliderinfo h2 span { color:#b9efff;}
.slidermail h2 { width:500px; font:bold 30px  Calibri, Tahoma, Arial; color:#fff; margin:0; padding:60px 0 10px 30px; line-height:1.2em;}
.slidermail h2 span { color:#b9efff;}
.sliderpeople h2 { width:500px; font:bold 30px  Calibri, Tahoma, Arial; color:#fff; margin:0; padding:60px 0 10px 30px; line-height:1.2em;}
.sliderperson h2 span { color:#b9efff;}
.sliderperson h2 { width:500px; font:bold 30px  Calibri, Tahoma, Arial; color:#fff; margin:0; padding:60px 0 10px 30px; line-height:1.2em;}
.sliderpeople h2 span { color:#b9efff;}
.sliderquestion h2 { width:500px; font:bold 30px  Calibri, Tahoma, Arial; color:#fff; margin:0; padding:60px 0 10px 30px; line-height:1.2em;}
.sliderquestion h2 span { color:#b9efff;}
.sliderccfhkids h2 { width:500px; font:bold 30px  Calibri, Tahoma, Arial; color:#fff; margin:0; padding:60px 0 10px 30px; line-height:1.2em;}
.sliderccfhkids h2 span { color:#b9efff;}
.sliderhighschool h2 { width:500px; font:bold 30px  Calibri, Tahoma, Arial; color:#fff; margin:0; padding:60px 0 10px 30px; line-height:1.2em;}
.sliderhighschool h2 span { color:#b9efff;}
.slider div.slice1 { margin:0 auto; width:964px; padding:0;}
.slider div div div { margin:0; padding:0; width:880px; height:220px; border:0;}
.slider div div div p.img { float:right; padding:0 30px; margin:0;}
.slider div div div h2 { font:bold 30px  Calibri, Tahoma, Arial; color:#fff; margin:0; margin:0; padding:15px 0 10px 0; line-height:1.2em;}
.slider div div div h2 span { color:#b9efff;}
.slider div div div p { font:normal 14px  Calibri, Tahoma, Arial; color:#fff; margin:0; margin:0; line-height:1.8em;}
/*****Menu_resize*********/
.Menu_resize { width:964px; margin:15px auto; padding:0; height:46px; background:url(images/menu_bg.gif) top no-repeat;}
/* menu */	
.menu { padding:0; margin:0; width:550px; float:left; height:27px;}
.menu ul { padding:3px 0; margin:0; list-style:none; border:0;}
.menu ul li { float:left; margin:0; padding:0 5px; border:0;}
.menu ul li a { float:left; margin:0 1px 0 0; padding:12px 0; color:#1d1d1d; font:normal 12px Calibri, Tahoma, Arial; text-decoration:none;}
.menu ul li a span { padding:12px 15px; background:none;}
.menu ul li a:hover { background:url(images/l_menu.gif) no-repeat right;}
.menu ul li a:hover span { background: url(images/r_menu.gif) no-repeat left;}
.menu ul li a.active { background:url(images/l_menu.gif) no-repeat right;}
.menu ul li a.active span { background:url(images/r_menu.gif) no-repeat  left;}

/*******Twitter**********/
.Twitter { width:60px; float:right; padding:5px 0; margin:0 20px 0 0; background: url(images/twitter.gif) right no-repeat; font:bold 12px Calibri, Tahoma, Arial; color:#7c7c7c; text-align:left;}
/*******Facebook**********/
.Facebook { width:60px; float:right; padding:12px 0; margin:0 20px 0 0; background: url(images/twitter.gif) right no-repeat; font:bold 12px Calibri, Tahoma, Arial; color:#7c7c7c; text-align:left;}
/********** block index **********/
.body { }
.body h2 { font:normal 30px  Calibri, Tahoma, Arial; color:#3a3c3c; border-bottom:1px solid #cccccc; padding:10px 10px 15px 40px; margin:0;}
.body p { font:normal 14px Calibri, Tahoma, Arial; color:#6f6f6f; line-height:1.8em;}
.body a { color:#1575a9; text-decoration:none;}
.body span { color:#2c2c2c; font:bold 14px Calibri, Tahoma, Arial; color:#2c2c2c;}
.body_resize { width:964px; margin:10px auto; padding:0; background:#fff;}
/****News ***/
.News  { width:222px; float:left; margin:5px 10px; padding:5px 10px;}
.News h2 { background:url(images/h2_News.gif) left no-repeat;}
.News h2.test { background:url(images/h2_testimo.gif) left no-repeat;}
.News h2.sub { background:url(images/h2_sub.gif) left no-repeat;}
.News p { font:normal 18px Calibri, Tahoma, Arial; color:#6f6f6f; line-height:1.8em;}
.News ul { margin:10px 30px; padding:0; list-style:none;}
.News li  { background:url(images/Sub_ul_li.gif) left no-repeat; padding:5px 0 5px 20px; margin:0;}
.News li a { font:normal 18px Calibri, Tahoma, Arial; color:#3a3c3c; text-decoration:none;}
.News li a:hover { color:#198eb5; text-decoration:underline;}
/********Welcome******/
.Welcome { width:527px; float:left; margin:5px 10px; padding:5px 10px;}
.Welcome span { font: bold 20px Calibri, Tahoma, Arial; color:#6f6f6f;}
.Welcome img { float:right; margin:20px 10px; padding:5px 5px;}
.Welcome h2 { background:url(images/h2_welcome.gif) left no-repeat;}
.Welcome h2.Abo { background:url(images/h2_aboult.gif) left no-repeat;}
.Welcome h2.Our { background:url(images/h2_Our.gif) left no-repeat;}
.Welcome h2.ser { background:url(images/h2_services.gif) left no-repeat;}
/*****What****/
.What { width:906px; float:left; margin:5px 10px; padding:5px 10px;}
.What h2 { background:url(images/h2_what.gif) left no-repeat;}
.What img { margin:25px 15px; float:left; padding:0;}
.What ul { list-style:none; margin:10px 200px; padding:0;}
.What li { font:bold 14px Calibri, Tahoma, Arial; color:#696969; background: url(images/ul_li.gif) left no-repeat; padding:5px 0 5px 20px; margin:0;}
/********** contact form **********/
#contactform { margin:0; padding:5px 10px;}
#contactform * { color:#222222;}
#contactform ol { margin:0; padding:0; list-style:none;}
#contactform li { margin:0; padding:0; background:none; border:none; display:block;}
#contactform li.buttons { margin:20px 0 20px 0;}
#contactform label { margin:0; width:110px; display:block; padding:10px 0; color:#666666; font: normal 14px  Calibri, Tahoma, Arial; text-transform:capitalize; float:left;}
#contactform label span { color:#ff0000;}
#contactform input.text { width:440px; border:1px solid #dcdcdc; margin:10px 0; padding:5px 2px; height:16px; background:#f5f5f5; float:left;}
#contactform textarea { width:440px; border:1px solid #dcdcdc; margin:10px 0; padding:2px; background:#f5f5f5; float:left;}
#contactform li.buttons input { padding:3px 0; margin:0; border:0; color:#FFF; float:left;}
p.response { text-align:center; color:#ff0000; font: normal 16px  Calibri, Tahoma, Arial; line-height:1.8em; width:auto;}

.FBG { background:#101010; border-top: 1px solid #212121; }
.FBG em { font:bold italic 14px Calibri, Tahoma, Arial; color:#616161; float: right;}
.FBG h2 { font:normal 22px  Calibri, Tahoma, Arial; color:#fff; border-bottom:1px solid #282828; padding:10px 5px 10px 5px; margin:0;}
.FBG p { font:normal 14px  Calibri, Tahoma, Arial; color:#666666; line-height:1.6em;}
.FBG img { margin:5px 5px; padding:0; float:left;}
.FBG a { font:normal 14px  Calibri, Tahoma, Arial; color:#1575a9; text-decoration:none;}
.FBG_resize { width:964px; margin:10px auto; padding:0; }
/****Recent **/
.Recent  { width:266px; float: left; padding:5px 10px; margin:5px 15px;}
.Recent img { float:right;}
/*************footer**********/
.footer { background: #090909; padding:20px 0; border-top:1px solid #1a1a1a;}
.footer .resize p.footer_logo { float:left; width:49%; padding:0; margin:0;}
.footer .resize div { float:right; width:49%; color:#939393; font:normal 14px Calibri, Tahoma, Arial; text-align:right;}
.footer .resize div p { float:left; padding:0; margin:0;}
.footer .resize div img { float:left;}
.footer .resize div a { color:#939393; font:normal 14px Calibri, Tahoma, Arial; padding:0 5px;}
.text_left { text-align:right;}

p.clr, .clr { clear:both; padding:0; margin:0; background:none;}
li.bg, .bg { clear:both; border-top:1px solid #dfdfdf; padding:0; margin:5px 0; background:none; line-height:0;}