@charset "utf-8";
/* Tom Cai CSS Document */

body { margin: 0 auto; background: #fff; font-family: Tahoma, "MS PGothic","MS UI Gothic",sans-serif;}
form,img { padding: 0; margin: 0; border: none;}

#header { width: 960px; margin: 0 auto; clear: both;}
.logo { clear: both; height: 100%; overflow: hidden; background: url(/images/header_bg.jpg) repeat-x left top; height: 70px;}
.logo img { float: left;}
.logo div { float: right; font: normal 11px/22px Tahoma, "MS PGothic","MS UI Gothic",sans-serif; text-align: right; color: #555;}
.logo div a { color: #555; text-decoration: none;}
.logo div a:hover { color: #0099cc; text-decoration: underline;}
.menu { background: url(/images/menu_bg.jpg) left top repeat-x; height:26px; color: #fff; padding: 0 10px;}
.menu ul { padding: 0; margin: 0;}
.menu ul li { list-style: none; float: left; padding: 0 15px; line-height: 26px; margin: 0; font: bold 13px/22px Tahoma, "MS PGothic","MS UI Gothic",sans-serif;}
.menu ul li a { color: #fff; text-decoration: none;}
.menu ul li a.on,.menu ul li a:hover { color: #000;}
.menu ul ri { list-style: none; float: right; padding: 0 15px; line-height: 26px; margin: 0; font: bold 13px/22px Tahoma, "MS PGothic","MS UI Gothic",sans-serif;}
.menu ul ri a { color: #fff; text-decoration: none;}
.menu ul ri a.on,.menu ul ri a:hover { color: #000;}
.menu div { float: right; padding:2px 0 0 0;}

.position { border: 1px solid #ccc; border-top: none; background: #eee; margin: 0 0 10px; height: 25px; font: normal 12px/25px Tahoma, "MS PGothic","MS UI Gothic",sans-serif; padding: 0 3px;}
.position a { color: #0099ff;}
.position a:hover { color: #0000ee;}
/*content---------------------------------*/
#content { width: 960px; margin: 0 auto; clear: both; height: 100%; overflow: hidden;}
/*-------*/
.left_box { float: left; width: 200px;}
.use_box { clear: both; border: 1px solid #A3C5EC; margin: 0 0 10px;}
.use_box div { text-align: center;}
.use_box h1,.use_box h2,.use_box h3 { border: 1px solid #fff; border-bottom: 1px solid #A3C5EC; display: block; background: #C0D7F0; padding: 0 3px; margin: 0; height: 22px; font: bold 13px/22px  Tahoma, "MS PGothic","MS UI Gothic",sans-serif; color: #333;}
.use_box h3 { background: url(/images/pro_list_right_icon.jpg) 180px no-repeat #c0d7f0;}
.use_box ul,.use_box dl { padding: 5px 5px 15px; margin: 0;}
.use_box ul li { list-style: none; padding: 0; margin:0; background: url(/images/list_icon.gif) left 7px no-repeat; padding: 0 0 5px 12px; font: normal 11px/19px  Tahoma, "MS PGothic","MS UI Gothic",sans-serif; color: #555;}
.use_box ul li a { color: #555;}
.use_box ul li a:hover { color: #0099ff;}
.use_box ul ri { list-style: none; padding: 0; margin:0; background: url(/images/list_icon.gif) right 7px no-repeat; padding: 0 0 5px 12px; font: normal 11px/19px  Tahoma, "MS PGothic","MS UI Gothic",sans-serif; color: #555;}
.use_box ul ri a { color: #555;}
.use_box ul ri a:hover { color: #0099ff;}
.use_box dl dt { list-style: none; padding: 0; margin:0; background: url(/images/products_list_icon.gif) left 7px no-repeat; padding: 0 0 5px 12px; font: normal 11px/19px  Tahoma, "MS PGothic","MS UI Gothic",sans-serif; color: #555;}
.use_box dl dt a { color: #0099ff;}
.use_box dl dt a:hover { color: #0000ee;}
/*-------*/
.right_box { float: right; width: 750px;}
.banner { clear: both; margin: 0 0 10px;}
.right_box_left { float: left; width: 540px;}
.right_box_right { float: right; width: 200px;}
/*-------*/
.productslist_box { clear: both; border: 1px solid #6E9AC6; margin: 0 0 10px; padding: 0 0 15px;}
.productslist_box h2 { border: 1px solid #fff; border-bottom: 1px solid #3F72A5; display: block; background: #6E9AC6; padding: 0 3px; margin: 0; height: 22px; font: bold 13px/22px  Tahoma, "MS PGothic","MS UI Gothic",sans-serif; color: #fff;}
.pro_list { padding: 15px 0; margin: 0 10px; font: normal 11px/20px Tahoma, "MS PGothic","MS UI Gothic",sans-serif; color: #333; border-bottom: 1px solid #ccc; height: 100%; overflow: hidden;}
.page_pro_list { padding: 15px 0; margin: 0 10px; font: normal 11px/20px Tahoma, "MS PGothic","MS UI Gothic",sans-serif; color: #333; height: 100%; overflow: hidden;}
.page_pro_list_2 { padding: 0px 0; margin: 0 0px; font: normal 11px/20px Tahoma, "MS PGothic","MS UI Gothic",sans-serif; color: #333; height: 100%; overflow: hidden;}

/*.pro_list .imgleft { margin-right: 10px;}*/
.pro_list_right h1,.page_pro_list_right h1 { padding: 0; margin: 0; font: bold 14px/22px Tahoma, "MS PGothic","MS UI Gothic",sans-serif; color: #0000ee;}
.pro_list_right h1 a,.page_pro_list_right h1 a { text-decoration: none; color: #0000ee;}
.pro_list_right h1 a:hover,.page_pro_list_right h1 a:hover { text-decoration: underline;}
.pro_list_right { float: right; width:378px; padding:0 0 0 10px;}
.page_pro_list_right a { color: #0099cc;}
.page_pro_list_right a.use_buttom { color: #0000ee;}
.page_pro_list_right a.use_buy { color: #fff;}
.pro_list_right .both,.page_pro_list_right .both { padding: 10px 0 0;}
.page_pro_list table td { padding: 0 2px;}
/*page*/
.page_pro_list_right { float: right; width:528px; font-size: 12px;}
.pro_features { padding: 0; margin: 20px 10px; background: #efefef; height:  100%; overflow: hidden;}
.pro_features h5 { padding: 0; margin: 0; display: block; background: url(/images/pro_features_icon.jpg) left top no-repeat; height: 21px; font: bold 12px/22px Tahoma, "MS PGothic","MS UI Gothic",sans-serif; color: #fff; text-indent: 18px;}
.pro_features div { padding: 10px; font: normal 12px/20px Tahoma, "MS PGothic","MS UI Gothic",sans-serif; color: #333;}
.pro_features ul { padding: 5px 10px; margin: 0;}
.pro_features ul li { padding: 0 0 5px; margin: 0;}
.pro_features dl { padding: 5px 10px; margin: 0;}
.pro_features dl dd { padding: 0; margin: 0 15px 15px 0; float: left;}
/*footer----------------------------------*/
#footer { width: 960px; border-top: 1px solid #ccc; margin: 10px auto; clear: both; font-size: 11px; line-height: 25px; color: #555;}
#footer span { float: right;}
#footer a { text-decoration: none; color: #555;}
#footer a:hover { color: #0099ff; text-decoration: underline;}

/*Public*/
.both { clear: both; height: 100%; overflow: hidden;}
.imgleft { float: left;}
.imgright { float: right;}
.use_buttom { background: url(/images/buttom_bg.jpg) right top no-repeat; height: 20px; padding-right: 10px; line-height: 20px; display: inline-block; text-decoration: none; margin: 0 10px 0 0; color: #0000ee; font-size: 12px;}
.use_buttom img { background: url(/images/buttom_bg.jpg) left top no-repeat; height: 20px; width: 10px; float: left;}
.use_upload { background: url(/images/buttom_bg.jpg) right bottom no-repeat; height: 20px; padding-right: 10px; line-height: 20px; display: inline-block; text-decoration: none; margin: 0 10px 0 0; color: #fff; font-size: 12px;}
.use_upload img { background: url(/images/buttom_bg.jpg) left bottom no-repeat; height: 20px; width: 10px; float: left;}
.use_buy { background: url(/images/buttom_bg.jpg) right no-repeat #999; height: 20px; padding-right: 10px; line-height: 20px; display: inline-block; text-decoration: none; margin: 0 10px 0 0; color: #fff; font-size: 12px;}
.use_buy img { background: url(/images/buttom_bg.jpg) left no-repeat; height: 20px; width: 10px; float: left;}
.search_box { background: url(/images/search_box_bg.jpg) left no-repeat; width: 170px; border: none; padding: 2px 0 0 7px; height: 18px;}
