@charset "utf-8";
/* CSS Document */
body { padding:0px; color: #e1e1e1; font-size: 11px; background: url(../images/body_bg.jpg) repeat-x; margin: 0px; font-family: "Lucida Sans Unicode", "Lucida Sans", "Lucida Grande", sans-serif; background-color:#333333; }
p { margin-top: 0px; margin-bottom: 20px; }
ul,li { list-style: none; margin: 0px; padding:0px}
img { border: none; }
a { text-decoration: none; color: #fff; }
a:focus {outline-style: none;}
input { font-family: Arial; }
.fleft { float: left; }
.mtop40 { margin-top: 40px!important; }

.contianer { width: 925px; margin: 0px auto; overflow: hidden; }

/*-nav-*/
.nav {  width: 925px; height: 96px; overflow: hidden; margin-top: 13px;}
.nav .log { float: left; margin-top: 8px; }
.nav .nav01_now { float: left; display:inline; margin: 27px 0px 0px 60px; width: 94px; height: 40px; background: url(../images/nav/nav01_now.png) no-repeat; }
.nav .nav02_now { float: left; display:inline; margin: 27px 0px 0px 50px; width: 85px; height: 40px; background: url(../images/nav/nav02_now.png) no-repeat; }
.nav .nav03_now { float: left; display:inline; margin: 27px 0px 0px 45px; width: 95px; height: 40px; background: url(../images/nav/nav03_now.png) no-repeat; }
.nav .nav04_now { float: left; display:inline; margin: 27px 0px 0px 45px; width: 110px; height: 40px; background: url(../images/nav/nav04_now.png) no-repeat; }
.nav .nav05_now { float: left; display:inline; margin: 27px 0px 0px 48px; width: 85px; height: 40px; background: url(../images/nav/nav05_now.png) no-repeat; }
.nav .nav06_now { float: left; display:inline; margin: 27px 0px 0px 44px; width: 80px; height: 40px; background: url(../images/nav/nav06_now.png) no-repeat; }
.nav .nav01 { float: left; display:inline; margin: 27px 0px 0px 60px; width: 94px; height: 40px; background: url(../images/nav/nav01.png) no-repeat; }
.nav .nav02 { float: left; display:inline; margin: 27px 0px 0px 50px; width: 85px; height: 40px; background: url(../images/nav/nav02.png) no-repeat; }
.nav .nav03 { float: left; display:inline; margin: 27px 0px 0px 45px; width: 95px; height: 40px; background: url(../images/nav/nav03.png) no-repeat; }
.nav .nav04 { float: left; display:inline; margin: 27px 0px 0px 45px; width: 110px; height: 40px; background: url(../images/nav/nav04.png) no-repeat; }
.nav .nav05 { float: left; display:inline; margin: 27px 0px 0px 48px; width: 85px; height: 40px; background: url(../images/nav/nav05.png) no-repeat; }
.nav .nav06 { float: left; display:inline; margin: 27px 0px 0px 44px; width: 80px; height: 40px; background: url(../images/nav/nav06.png) no-repeat; }
.nav .nav01:hover { background: url(../images/nav/nav01.png) no-repeat 0px -40px; }
.nav .nav02:hover { background: url(../images/nav/nav02.png) no-repeat 0px -40px; }
.nav .nav03:hover { background: url(../images/nav/nav03.png) no-repeat 0px -40px; }
.nav .nav04:hover { background: url(../images/nav/nav04.png) no-repeat 0px -40px; }
.nav .nav05:hover { background: url(../images/nav/nav05.png) no-repeat 0px -40px; }
.nav .nav06:hover { background: url(../images/nav/nav06.png) no-repeat 0px -40px; }

/*----------------index---*/

.indexbg { background: url(../images/indexbg1.jpg) repeat-x; }
.top { float: left; width: 925px; height: 460px; overflow: hidden; }
.top .top_bg01 { position: absolute; z-index: -1; margin: -109px 0px 0px -63px; width: 1130px; height: 459px; background: url(../images/bg01.jpg) no-repeat}

.top .top_txt { position: absolute; margin: 73px 0px 0px 0px; }
.top .bn1 { position: absolute; width: 193px; height: 47px; margin: 200px 0px 0px 0px; background: url(../images/bn1.png) no-repeat; }
.top .bn1:hover { background: url(../images/bn1.png) no-repeat 0px -47px; }
.top .bn2 { position: absolute; width: 208px; height: 47px; margin: 200px 0px 0px 210px; background: url(../images/bn2.png) no-repeat; }
.top .bn2:hover { background: url(../images/bn2.png) no-repeat 0px -47px; }
.top .computer { position: absolute; margin: 45px 0px 0px 463px; width: 440px; height: 250px; background: url(../images/computer.png);}
.top .com_pic { margin: 21px 0px 0px 70px; width: 299px; height: 184px; cursor: pointer; }
.top .pic_over { display: none; position: absolute; cursor: pointer; margin: -184px 0px 0px 70px; width: 299px; height: 184px; background: url(../images/pic_over.png) no-repeat;  *background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./images/pic_over.png',sizingMethod='crop'); }
.con { float: left; width: 925px; }
.con .picbox { float: left; display: inline; margin-left: 12px; margin-right:6px; margin-top: 18px; width: 280px; }
.con .picbox .pic { float: left; width: 283px; height: 174px; padding-top: 6px; text-align: center; background: url(../images/pic_box.png) no-repeat; overflow: hidden; }
.con .picbox .txt { float: left; margin-top: 0px; line-height: 18px; color: #fff; font-size: 11px; }
.con .picbox .txt .cap { color: #D3254E; font-size: 15px; line-height: 30px; border-bottom:1px dotted #CB296F;}

.footer { float: left; width: 925px; }
.footer .footer_ms { float: left; display: inline; margin: 40px 0px 20px 10px; width: 915px; overflow: hidden; background: url(../images/footer_bg.png) no-repeat; }
.footer .footer_ms ul { float: left; display: inline; overflow:hidden; margin: 15px 0px 0px 13px; }
.footer .footer_ms ul li { float: left; color: #DCD7D7; font-size: 11px; line-height: 22px; }
.footer .footer_ms ul li a { color: #DCD7D7; font-size: 11px; }
.footer .footer_ms ul li a:hover { text-decoration: underline; }
.footer .footer_ms .u1 { width: 227px; }
.footer .footer_ms .u1 li { width: 227px; }
.footer .footer_ms .u2 { width: 227px; }
.footer .footer_ms .u2 li { width: 227px; }
.footer .footer_ms .u3 { width: 410px; }
.footer .footer_ms .u3 li { width: 410px; }
.footer .footer_ms .footer_bt { float: left; margin-top: 50px; width: 915px; color: #e0e2e4; font-size:10px; }
.footer .footer_ms .footer_bt .txt { float: left; margin-top: 10px; }
.footer .footer_ms .footer_bt .txt a { color: #e0e2e4; }
.footer .footer_ms .footer_bt .links { float: right; }
.footer .footer_ms .footer_bt .links a { float: left; display: inline; margin-right: 10px; }

/*----------------portfolio---*/

.top01 { float: left; width: 925px; height: 110px; overflow: hidden; background: }
.banner { float: left; width: 925px; overflow: hidden; margin: 40px 0px 15px; }
.top01 .top_bg02 { position: absolute; margin: -109px 0px 0px -63px; z-index: -1; width: 1120px; height: 378px; background: url(../images/bg01.jpg) no-repeat; }
.con .box01 { float: left; margin-top: 30px; width: 895px; font-size: 11px; line-height: 18px; font-style: italic;  color: #fff; padding: 20px 15px 0px; background: url(../images/line01.png) no-repeat; }
.con .box01 .txt { float: left; width: 620px; }
.con .box01 .txt img { margin-bottom: 10px; }
.con .box01 .bn3 { float: right; background: url(../images/bn1.png) no-repeat; width: 193px; height: 47px; }
.con .box01 .bn3:hover { background: url(../images/bn1.png) no-repeat 0px -47px; }

/*----------------about---*/

.con .box02 { float: left; width: 519px; padding: 0px  25px 30px 10px;  border-right: 1px solid #333333;  }
.con .box02 li { line-height: 24px; background: url(../images/icon_g.png) no-repeat 0px 9px; padding-left: 15px; }
.con .box03 { float: left; width: 310px; padding: 0px 10px 0px 30px; }

/*----------------services---*/

.con .box04 { float: left; display: inline; margin: 0px 0px 0px 15px;  width: 440px; overflow: hidden;  }
.con .boxwide { float: left; display: inline; margin: 0px 0px 0px 15px;  width: 900px; overflow: hidden;  }
.con .line02 { float: left; width: 925px; height: 3px; margin: 0px 0px 20px 0px;   background: url(../images/line02.png); font-size: 0px; }

/*----------------blog---*/

.con .bloglist { float: left; width: 655px; padding: 10px 20px 0px 5px; border-right: 1px solid #333333;  }
.con .bloglist .box05 { float: left; width: 655px; margin-bottom: 35px; border-bottom:  1px solid #333333; }
.con .bloglist .box05 .data { float: left; color: #000; text-align: center; width: 51px; height: 50px; display: inline; margin-right: 9px; background: url(../images/data.png) no-repeat; overflow: hidden; }
.con .bloglist .box05 .data .month { float: left; width: 51px; font-size: 10px; margin-top: 18px; height: 10px; line-height: 10px; }
.con .bloglist .box05 .data .day { float: left; width: 51px; font-size: 16px; height: 18px; line-height: 18px; }
.con .bloglist .box05 .data .day sup { font-size: 10px; }
.con .bloglist .box05 .txt { float: left; width: 595px; }
.con .bloglist .box05 .txt p { margin-bottom: 15px; }
.con .bloglist .box05 .txt .cap02 { font-size: 16px; font-weight: bold; text-transform: uppercase;} 
.con .bloglist .box05 .txt .pt { margin-bottom: 10px; }
.con .bloglist .fy { float: left; width: 655px; text-align: right; }
.con .bloglist .fy a { margin-right: 10px; background-image:url(../images/blog_linksbg.png); padding-top:5px; padding-left:10px; padding-bottom:10px; padding-right:10px; width:80px; display:block; float:right;}
.con .bloglist .fy a:hover {  text-decoration: underline; }
.con .bloglist .fy .ahover {  text-decoration: underline; }
.con .rightlist { float: right; width: 220px; }
.con .rightlist ul { float: left; width: 220px; margin-bottom: 40px; }
.con .rightlist ul li { float: left; width: 205px; line-height: 18px; padding: 5px 0px 5px 15px; background: url(../images/icon_j.png) no-repeat 0px 11px;  border-bottom:  1px solid #333333; }
.con .rightlist ul li a:hover { text-decoration: underline; }
.con .rightlist ul .cap01 { padding-left: 0px; background: none; border: none; }
.con .rightlist ul .bordernone { border: none; }



.con .flist { float:left; width: 170px; margin-left:50px; }
.con .flist ul { float: left; width: 170px; margin-bottom: 20px; }
.con .flist ul li { float: left; width: 160px; line-height: 18px; padding: 5px 0px 5px 15px; background: url(../images/icon_j.png) no-repeat 0px 11px;  border-bottom:  1px solid #333333; }
.con .flist ul li a:hover { text-decoration: underline; }
.con .flist ul .cap01 { padding-left: 0px; background: none; border: none; }
.con .flist ul .bordernone { border: none; }

/*----------------contact---*/

.con .bloglist .tab { float: left; width: 655px; font-size: 12px; line-height: 24px; }
.con .bloglist .tab td { padding-bottom: 20px; }
.con .bloglist .tab .bn4 { float: left; display: inline; margin-right: 25px; line-height: 25px; padding-left: 9px; width: 110px; height: 25px; background: url(../images/bn4.jpg) no-repeat; }
.con .bloglist .tab .bn4:hover {background: url(../images/bn4.jpg) no-repeat 0px -25px; }
.con .bloglist .tab .ahover {float: left; display: inline; margin-right: 25px; line-height: 25px; padding-left: 9px; width: 110px; height: 25px; background: url(../images/bn4.jpg) no-repeat 0px -25px; }
.con .bloglist .tab .txtbox01 { width: 191px; height: 21px; color: #fff; padding-left: 10px; padding-top: 6px; background: url(../images/txtbox01.jpg); border: none; }
.con .bloglist .tab .txtbox02 { width: 82px; height: 21px;  color: #fff; padding-left: 10px; padding-top: 6px; background: url(../images/txtbox02.jpg); border: none; }
.con .bloglist .tab textarea { background: url(../images/textare.jpg) no-repeat #536373; color: #fff; width: 420px; height: 83px; padding: 5px; border: none; }
.con .bloglist .tab .submit { float: right; display: inline; margin: 10px 15px 0px 0px; width: 108px; height: 28px; background: url(../images/submit.png) no-repeat; border: none; cursor: pointer; }
.con .bloglist .tab .subt { float: left; margin-top: 10px; }
.con .rightlist .txt01 { line-height: 20px; }
.con .rightlist .txt01 p { margin-bottom: 15px; }

/*----------------availability---*/

.con .box06 { float: left; width: 925px; font-size: 11px; line-height: 18px; border-bottom: 1px solid #333333; color: #fff;  }
.con .box06 .txt { float: left; width: 620px; padding-bottom: 15px; }
.con .box06 .txt img { margin-bottom: 10px; }
.con .box06 .bn3 { float: right; background: url(../images/bn1.png) no-repeat; width: 193px; height: 47px; }
.con .box06 .bn3:hover { background: url(../images/bn1.png) no-repeat 0px -47px; }

/*----------------project---*/

.projectbg { background: url(../images/projectbg.jpg) repeat-x; }
.top01 .top_bg03 { position: absolute; margin: -109px 0px 0px -63px; z-index: -1; width: 1120px; height: 375px; background: url(../images/bg01.jpg) no-repeat; }
.con .sor_banner { float: left; width: 925px; height: 265px; overflow: hidden; }

/*roll*/

.sorbox {  position: absolute; z-index: 5; margin: 38px 0px 0px -48px; width: 998px; height: 175px;}
.sorbox .pcont {FLOAT: left; OVERFLOW: hidden; WIDTH: 886px; height: 175px; }
.sorbox .ScrCont { WIDTH: 32766px; ZOOM: 1 }
.sorbox #List1_1 { FLOAT: left; margin: 0px;}
.sorbox #List2_1 { FLOAT: left; margin: 0px;}
.sorbox .LeftBotton { float: left; display: inline; margin-right: 20px; margin-top: 70px; width: 37px; height: 23px; background: url(../images/left_t.png) no-repeat; }
.sorbox .RightBotton { float: right; width: 37px; height: 23px; margin-top: 70px;  background: url(../images/right_t.png) no-repeat; }
.sorbox .pic { float: left; display: inline; margin-right: 20px; width: 282px; height: 175px; padding-top: 6px; text-align: center; background: url(../images/pic_box02.png) no-repeat; overflow: hidden; }

.con .sor_banner .bigpic { position: absolute; z-index: 99; margin-left: 157px; background: #fff; border: 5px solid #222; padding: 10px; display: none; }
.con .sor_banner .bigpic .close {  position: absolute; margin: -27px 0px 0px 567px; width: 30px; height: 30px; background: url(../images/close.png);  *background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./images/close.png',sizingMethod='crop'); cursor: pointer;  }
.con .sor_banner .txt { position: absolute; margin: 220px 0px 0px 15px; }
.con .ms { float: left; width: 925px; }
.con .ms .mstop { float: left; padding: 12px 0px 10px; width: 925px; color: #6ACBE3; font-size: 16px; line-height: 22px; border-bottom: 1px solid #202528; }
.con .ms .mstop .cap_l { float: left;}
.con .ms .mstop .cap_r { float: right; margin-top: 20px; padding-left: 20px; background: url(../images/bj.png) no-repeat 0px 3px; color: #6ACBE3; font-weight: bold; }
.con .ms .left01 { float: left; width: 495px; padding-top: 12px; }
.con .ms ul { float: left; width: 300px; display: inline; margin: 40px 0px 0px 60px; }
.con .ms ul li { float: left; width: 300px; padding: 7px 0px 7px 15px; background: url(../images/icon_g.png) no-repeat 0px 13px;  }
.con .ms ul li a { float: left; }
.con .ms ul li a:hover { text-decoration: underline; }
.con .ms ul .cap { font-weight: bold; background: none; padding: 7px 0px; }
.con .box01 .back { float: left; padding-left: 23px; background: url(../images/pen.png) no-repeat; font-size: 14px; font-style: normal; }

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/lightbox/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }