/***************** Copyright: magiccg.com.cn Version: 0.2 Design by Gesitseele Code by Gesitseele Website: http://www.magiccg.com.cn 2009.09 ****************/ /*----- Common ----*/ * {padding:0;margin:0;font-size:12px;font-family:Verdana,Arial,Helvetica,sans-serif;} h1, h2, h3, h4, h5, h6, p, form {margin:0;padding:0;} body {background-color:white;} ul,li {list-style:none; } img {border:none;} a:focus {outline: none} a:link {text-decoration: none; color:#436BB5} a:visited {text-decoration: none;color: #436BB5;} a:hover {text-decoration: underline;color:#002D5B;} a:active {text-decoration: none} .hidden {display:none;} .clear {clear:both; display:block; font-size:0px; line-height:0px} .hidden {display: none;} .lightblue {color:#0080D9; } .darkblue { color:#001A78; font-size:14px;} /*----- Top ----*/ #content {width:100%} #top {background: url(../images/topbg.jpg) no-repeat scroll center top; width:980px; height:230px; margin:0 auto; position:relative;} #logo a {background:url(../images/logo_icon2.gif) no-repeat; width:150px; height:126px; text-indent:-999px; display:block; position:absolute; top:29px; left:418px; } /*----- Navigation ----*/ #nav {width:980px; height:57px; margin-top: 0px; padding-top: 172px; padding-left: 45px; margin-bottom: 5px;} * html #nav {width:980px; height:57px; margin-top: 172px; padding-top: 0px; padding-left: 0px; margin-bottom: 5px;} *+html #nav {width:980px; height:57px; margin-top: 143px; padding-top: 0px; padding-left: 0px; margin-bottom: 5px;} #nav ul li {float:left; margin-left:37px;} * html #nav ul li {float:left; margin-left: 37px; } *+html #nav ul li {float:left; margin-left:40px;} #nav ul li a { width:138px; height:57px; display:block; text-indent:-9999px;} #nav_au {background:url(../images/nAboutus.jpg) 0 0 no-repeat;} #nav_au a {background:url(../images/nAboutus.jpg) 0 -63px no-repeat;} #nav_sl {background:url(../images/nSolutions.jpg) no-repeat;} #nav_sl a {background:url(../images/nSolutions.jpg) 0 -63px no-repeat;} #nav_sv {background:url(../images/nServices.jpg) no-repeat;} #nav_sv a {background:url(../images/nServices.jpg) 0 -63px no-repeat;} #nav_ns {background:url(../images/nNews.jpg) no-repeat;} #nav_ns a {background:url(../images/nNews.jpg) 0 -63px no-repeat;} #nav_ct {background:url(../images/nContact.jpg) no-repeat;} #nav_ct a {background:url(../images/nContact.jpg) 0 -63px no-repeat;} /*----- Banner ------*/ #banner {width: 906px; height:273px; margin:0 auto;position:relative; margin-bottom: 5px;} #banner div{position:absolute;top:0;left:0;z-index:8;opacity:0.0;height:273px;overflow:hidden;} #banner div.current{z-index:10;} #banner div.prev{z-index:9;} #banner div img{display:block;border:0;} /*----- Newsbanner ------*/ #index_news { width:906px; height:50px; margin:0 auto; background:url(../images/newsbg.jpg) no-repeat scroll center top; margin-top: 20px; margin-bottom:-10px;} #index_news_text { width:800px; height:33px; line-height:33px; font-weight:normal; font-size:12px; float:left; padding-left:64px;} #index_news_text a {color: #676767; font-size:12px; font-family:Arial, Helvetica, sans-serif;} #index_news_text a:hover {text-decoration:none; color:#C20C33} /*----- indexcontent ------*/ #indexcontent {width: 906px; margin: 0 auto; color:#676767; font-size: 9pt;} #indexcontent #title {font-size: 10pt; font-weight: normal; color: #676767;} #indexcontent a{font-size: 10pt; font-weight: normal; color: #676767;} #indexcontent #titlepic1 {border: 0px solid #B8B7B6; margin-top: 10px;} #indexcontent #titlepic2 {border: 0px solid #B8B7B6; margin-top: 10px;} #indexcontent #titlepic3 {border: 0px solid #B8B7B6; margin-top: 10px;} #indexcontent #colleft {float: left; height:150px; width: 275px; border: 0px solid #B8B7B6; background-color: #E0DFDF; margin-top: 10px; padding: 10px 10px 5px 10px;} #indexcontent #colmiddle {float: left; height:150px; width: 275px; border: 10px solid #fff; background-color: #E0DFDF; margin-top: 0px; padding: 10px 10px 5px 10px;} #indexcontent #colright {float: right; height:150px; width: 270px; border: 0px solid #B8B7B6; background-color: #E0DFDF; margin-top: 10px; padding: 10px 10px 5px 10px;} /*----- works ------*/ #index_works { width:906px; height:130px; margin:0 auto; border-bottom:#C5D4E9 solid 0px;} #index_works div {float:left; position:relative; padding-right:28px;} #index_works div a { width:204px; height:111px; display:block; } #index_works p { width:204px; height:111px; display:block; position:absolute; top:0; left:0; cursor:pointer; } #index_works_if { background:url(../images/mpWorks_if.jpg) 0 0px no-repeat;} #index_works_if p { background:url(../images/mpWorks_if.jpg) 0 -111px no-repeat;} #index_works_mm { background:url(../images/mpWorks_mm.jpg) 0 0 no-repeat;} #index_works_mm p { background:url(../images/mpWorks_mm.jpg) 0 -111px no-repeat;} #index_works_ud { background:url(../images/mpWorks_ud.jpg) 0 0 no-repeat;} #index_works_ud p { background:url(../images/mpWorks_ud.jpg) 0 -111px no-repeat;} #content #index_works_ai { float:right; padding-right:0;} #index_works_ai { background:url(../images/mpWorks_ia.jpg) 0 0 no-repeat;} #index_works_ai p { background:url(../images/mpWorks_ia.jpg) 0 -111px no-repeat;} #index_works2 { width:906px; height:130px; margin:0 auto; border-bottom:#C5D4E9 solid 1px;} #index_works2 div {float:left; position:relative; padding-right:28px;} #index_works2 div a { width:204px; height:111px; display:block; } #index_works2 p { width:204px; height:111px; display:block; position:absolute; top:0; left:0; cursor:pointer; } #index_works_if2 { background:url(../images/mpWorks_if2.jpg) 0 0 no-repeat;} #index_works_if2 p { background:url(../images/mpWorks_if2.jpg) 0 -112px no-repeat;} #index_works_mm2 { background:url(../images/mpWorks_mm2.jpg) 0 0 no-repeat;} #index_works_mm2 p { background:url(../images/mpWorks_mm2.jpg) 0 -112px no-repeat;} #index_works_ud2 { background:url(../images/mpWorks_ud2.jpg) 0 0 no-repeat;} #index_works_ud2 p { background:url(../images/mpWorks_ud2.jpg) 0 -112px no-repeat;} #content #index_works_ai2 { float:right; padding-right:0;} #index_works_ai2 { background:url(../images/mpWorks_ia2.jpg) 0 0 no-repeat;} #index_works_ai2 p { background:url(../images/mpWorks_ia2.jpg) 0 -112px no-repeat;} /*------------------------- Solutions --------------------------*/ /*----- solutionsTitle ------*/ #solutionsTitle {width:954px; height: 273px; margin:0 auto; margin-bottom:10px;} #solutionsTitle #b1 {background:url(../images/solutiontitle_01.jpg) no-repeat scroll center top; float: left; width: 477px; height: 91px; } #solutionsTitle #b2 {background:url(../images/solutiontitle_03.jpg) no-repeat scroll center top; float: left; width: 477px; height: 91px; } #solutionsTitle #b3 {background:url(../images/solutiontitle_05.jpg) no-repeat scroll center top; float: left; width: 477px; height: 91px; } #solutionsTitle #b4 {background:url(../images/solutiontitle_02.jpg) no-repeat scroll center top; float: left; width: 477px; height: 91px; } #solutionsTitle #b5 {background:url(../images/solutiontitle_04.jpg) no-repeat scroll center top; float: left; width: 477px; height: 91px; } #solutionsTitle #b6 {background:url(../images/solutiontitle_06.jpg) no-repeat scroll center top; float: left; width: 477px; height: 91px; } /*----- closebanner ------*/ #closebanner { width:980px; height:25px; margin:0 auto; background:url(../images/closebanner.jpg) no-repeat scroll center top;} /*----- portfolio ------ */ #protfolio{ width:954px; margin:0 auto; background-color: white;} #portfolionav {width: 954px; height: 100px;background-image: url(../images/portfolio_top.jpg) ; float: left;position: relative;z-index: 0;margin-bottom:-70px;top:-70px;} #portfolio_hover {float: left;position: relative;z-index: 1000;top:24px;left:88px;} /* Moz */ * html #portfolio_hover {float: left;position: relative;z-index: 1000;top:24px;left:88px;} /* IE6 */ *+html #portfolio_hover {float: left;position: relative;z-index: 1000;top:24px;left:77px;} /* IE7 */ #portfolionav #navleft {margin-left: 30px;margin-top: 20px;display: block;float: left;width: 31px;height: 62px;background-image: url(../images/portfolio_navleft.gif);} * html #portfolionav #navleft {margin-left: 15px;margin-top: 18px;display: block;float: left;width: 31px;height: 62px;background-image: url(../images/portfolio_navleft.gif);} *+html #portfolionav #navleft {margin-left: 15px;margin-top: 18px;display: block;float: left;width: 31px;height: 62px;background-image: url(../images/portfolio_navleft.gif);} #portfolionav #navright {margin-left: 30px;margin-top: 20px;display: block;float: left;width: 31px;height: 62px;background-image: url(../images/portfolio_navright.gif);} * html #portfolionav #navright {margin-left: 33px;margin-top: 18px;display: block;float: left;width: 31px;height: 62px;background-image: url(../images/portfolio_navright.gif);} *+html #portfolionav #navright {margin-left: 33px;margin-top: 18px;display: block;float: left;width: 31px;height: 62px;background-image: url(../images/portfolio_navright.gif);} #carousel {margin-left:30px;margin-top:10px;width: 768px;height: 80px; float: left;overflow: hidden;} #portfolionav #navright:hover { background-image: url(../images/portfolio_navrighthover.gif); } #portfolionav #navleft:hover { background-image: url(../images/portfolio_navlefthover.gif); } .portfolioitem {width: 128px;height: 80px;float: left;cursor: pointer;} #carousel #inner {width: 100000px;} #portfoliostage {background-color: #EFEDEC; height: 350px;width: 952px;float: left; border: #ccc solid 1px;}/* Moz */ #menuitem1 { width: 105px; background-image: url(../images/pmenu_item1_hover.jpg); } #menuitem2 { width: 105px; background-image: url(../images/pmenu_item2.jpg); } #menuitem3 { width: 110px; background-image: url(../images/pmenu_item3.jpg); } #menuitem4 { width: 106px; background-image: url(../images/pmenu_item4.jpg); } #menuitem5 { width: 105px; background-image: url(../images/pmenu_item5.jpg); } #menuitem1:hover { background-image: url(../images/pmenu_item1_hover.jpg); } #menuitem2:hover { background-image: url(../images/pmenu_item2_hover.jpg); } #menuitem3:hover { background-image: url(../images/pmenu_item3_hover.jpg); } #menuitem4:hover { background-image: url(../images/pmenu_item4_hover.jpg); } #menuitem5:hover { background-image: url(../images/pmenu_item5_hover.jpg); } #portfolioitem1 { background-image: url(../images/pthumb_1active.jpg); } #portfolioitem2 { background-image: url(../images/pthumb_2.jpg); } #portfolioitem3 { background-image: url(../images/pthumb_3.jpg); } #portfolioitem4 { background-image: url(../images/pthumb_4.jpg); } #portfolioitem5 { background-image: url(../images/pthumb_5.jpg); } #portfolioitem6 { background-image: url(../images/pthumb_6.jpg); } #portfolioitem7 { background-image: url(../images/pthumb_7.jpg); } #portfolioitem8 { background-image: url(../images/pthumb_8.jpg); } #portfolioitem9 { background-image: url(../images/pthumb_9.jpg); } #portfolioitem10 { background-image: url(../images/pthumb_10.jpg); } #portfolioitem11 { background-image: url(../images/pthumb_11.jpg); } #portfolioitem1:hover { background-image: url(../images/pthumb_1active.jpg); } #portfolioitem2:hover { background-image: url(../images/pthumb_2active.jpg); } #portfolioitem3:hover { background-image: url(../images/pthumb_3active.jpg); } #portfolioitem4:hover { background-image: url(../images/pthumb_4active.jpg); } #portfolioitem5:hover { background-image: url(../images/pthumb_5active.jpg); } #portfolioitem6:hover { background-image: url(../images/pthumb_6active.jpg); } #portfolioitem7:hover { background-image: url(../images/pthumb_7active.jpg); } #portfolioitem8:hover { background-image: url(../images/pthumb_8active.jpg); } #portfolioitem9:hover { background-image: url(../images/pthumb_9active.jpg); } #portfolioitem10:hover { background-image: url(../images/pthumb_10active.jpg); } #portfolioitem11:hover { background-image: url(../images/pthumb_11active.jpg); } #stagecontent #leftcol { float: left; width: 450px; margin-top: 22px; margin-left: 10px; color: #6B6B6B; font-size: 12px;} #stagecontent #rightcol { float: left; margin-left: 22px; margin-top: 44px; width: 437px; color: #6B6B6B; font-size: 13px;} #stagecontent #rightcol p { margin-top: 11px; margin-bottom: 11px; line-height: 1.5em; color:#6B6B6B; } #stagecontent #leftcol #projectvitals { margin-left: 5px; margin-top: 22px; margin-bottom: 7px; } #stagecontent #leftcol .vital { margin-left: 7px; margin-top: 5px; } #stagecontent #rightcol #title { float: left; margin-top: 0px; padding-bottom: 7px; border-bottom: 2px solid #30466D;} #stagecontent #rightcol #launchsite { float: right; background-image: url(../images/launchsite.jpg); width: 114px;height: 31px;} #stagecontent #rightcol #launchsite:hover { background-position: 0 -31px;} /*------------------------- Service ----------- ---------------*/ /*----- servicesTitle ------*/ #servicesTitle {margin:0 auto; width:954px; height: 273px; margin-bottom:10px;} #servicesTitle #s1 {background:url(../images/servicesTitle_01.jpg) no-repeat scroll center top; float: left; width: 477px; height: 91px; } #servicesTitle #s2 {background:url(../images/servicesTitle_03.jpg) no-repeat scroll center top; float: left; width: 477px; height: 91px; } #servicesTitle #s3 {background:url(../images/servicesTitle_05.jpg) no-repeat scroll center top; float: left; width: 477px; height: 91px; } #servicesTitle #s4 {background:url(../images/servicesTitle_02.jpg) no-repeat scroll center top; float: left; width: 477px; height: 91px; } #servicesTitle #s5 {background:url(../images/servicesTitle_04.jpg) no-repeat scroll center top; float: left; width: 477px; height: 91px; } #servicesTitle #s6 {background:url(../images/servicesTitle_06.jpg) no-repeat scroll center top; float: left; width: 477px; height: 91px; } #sectop {width: 954px; height: 35px; margin: 0 auto; background:url(../images/services_top.jpg) no-repeat scroll center top; } #sectop ul{ list-style-type:none; width:954px; height: 30px;} #sectop li { float:left; width:220px; height: 30px; text-align:center;cursor:pointer; height:16px; } #sectop ul .currentStyle {background:url(../images/tophead.gif) no-repeat scroll center top; margin: 10px 0px 0px 10px; width:220px; height: 30px; line-height: 30px; font-size: 1.1em; font-weight: 800; color: black;font-family: 宋体;} #sectop ul .noneStyle{background:url(../images/tophead_off.gif) no-repeat scroll center top; margin: 10px 0px 0px 10px;height: 30px; line-height: 30px; font-size: 0.9em; font-weight: bolder; color: #DFDFDF;} .box_content{ margin:0 auto; border:1px solid #CCCCCC; border-top: none; width:952px; height: 1000px; display:none;background-color: #F2EFE9;} #spiltline { margin:0 auto; width: 920px; height: 1px; border-top: 1px dashed #676767;} #desc {margin:0 auto; width: 910px; font-size: 9pt; color: #EE3072; line-height: 20px; margin-top: 0px; } #boxM {margin: 20px 0px 10px 10px; float: left; width: 925px; height: auto;} #boxM #title {border-bottom:1px solid #000;padding-bottom:7px;} #boxM p{margin: 5px 0px 0px 0px; color: #676767; line-height: 19px;} #boxMP {margin: 0px 0px 10px 10px; float: left; width: 925px; height: auto;} #boxL {margin: 20px 0px 10px 10px; float: left; width: 440px; height: 240px; } #boxL p {font-size: 9pt; color: #676767; line-height: 19px;} #boxR{margin: 20px 10px 10px 0px; float: right; width: 450px; height: 240px; } #boxR #title {border-bottom:1px solid #676767;padding-bottom:7px;} #boxR p {font-size: 9pt; color: #676767; line-height: 19px;} #boxLP {margin: 20px 0px 10px 10px; float: left; width: 440px; height: 240px; color: #000; text-align: center; } #boxLP span{color: #EE3072} #boxRP{margin: 20px 10px 10px 0px; float: right; width: 450px; height: 240px; color: #000; text-align: center; } #boxRP span{color: #EE3072} #boxP { margin: 0px 0px 10px 10px; float: left; width: 925px; height: auto;} /*------------------------- news --------------------------*/ #newsTitle {background:url(../images/newsTitle.jpg) no-repeat scroll center top; width:954px; height: 180px; margin:0 auto; margin-bottom:10px;} #newsContent {width: 954px; margin:0 auto; } #newsContent #colLeft {width: 300px; float: left; } #newsContent #colright {width: 640px; float: right; background-color: #B7C3CC;} #newsContent #colrhead{width: 640px; height:31px; background:url(../images/newsrcolbg.jpg) no-repeat scroll center top;} #newsContent #rowShort {width: 300px; height: 330px; background:url(../images/row401.jpg) no-repeat scroll center top; margin-bottom: 5px;} #newsContent #rowShort1 {width: 300px; height: 330px; background:url(../images/newsbgs.jpg) no-repeat scroll center top; margin-bottom: 5px;} #newsContent #rowLong {margin-bottom: 15px;} #newsContent #canlendaricon {width: 47px; height:50px; background:url(../images/calendarbg.gif) no-repeat scroll center top; margin-left: 8px;} #newsContent #newstext {width: 640px; height: 60px; background:url(../images/row5.jpg) no-repeat scroll center top;} #newsContent .textcontent{margin: 10px 10px 5px 17px; font-size:0.8em; color: #676767; font-weight: lighter; font-family: 'Times New Roman'; } #newsContent #canlendaricon .month { color:#FFFFFF; font-family:Georgia,'Times New Roman',serif; font-size:0.9em; font-weight:bold; margin-top:2px; text-align:center; } #newsContent #canlendaricon .day { color:#FFFFFF; font-family:Georgia,'Times New Roman',serif; font-size:1.7em; font-weight:bold; margin-top:-1px; text-align:center; } /*------------------------- contact --------------------------*/ #contactTitle {margin-top:50px; width:954px; height: 300px; border: 1px solid gray; margin:0 auto; margin-top:8px; margin-bottom:10px;} #cntcontact {background-color: #F2EFE9; width: 348px; height: 330px; float: right; border-left: 1px solid gray; } #cntcontact h3 { border-bottom:1px solid #B2B1B1; color:#000000; font-family:Arial,Helvetica,sans-serif; font-size:14px; font-weight:bold; height:28px; margin-bottom:25px; margin-left:25px; padding-top:25px; text-decoration:none; width:300px; } #cntcontact h4 { color: #5B6E91; font-family:Arial,Helvetica,sans-serif; font-size:12px; font-weight:bold; padding-left:25px; text-decoration:none; } #cntcontact p { color:#676767; font-family:Arial,Helvetica,sans-serif; font-size:12px; font-weight:normal; padding-bottom:15px; padding-left:25px; padding-right:28px; text-decoration:none; } /*------------------------- aboutus --------------------------*/ #aboutTitle {background:url(../images/aboutustitle.jpg) no-repeat scroll center top; width:954px; height: 180px; margin:0 auto; margin-bottom:10px;} #aboutbox {background:url(../images/aboutusbg.jpg) no-repeat scroll center top; margin:0 auto; width:954px; height: 270px; margin-bottom:10px; } #aboutbox #colLeft {background:url(../images/logoSliver.jpg) no-repeat scroll center; float:left; text-align: left; width: 180px; padding: 280px 0px 0px 30px; } #aboutbox #colRight {float:right; text-align: left; width: 700px; font-size: 10pt; padding: 70px 10px 10px 10px; line-height: 22px;} /*------------------------- show --------------------------*/ #showTitle {background:url(../images/showtitle.jpg) no-repeat scroll center top; width:954px; height: 273px; margin:0 auto; margin-bottom:10px;} #showcontent {margin:0 auto; width:954px; background-color: #F2EFE9; } #showbox { width: 952px; margin: 0 auto; border: 1px solid #CCCCCC; border-top: none; background-color: #EFEDEC;} #showbox #vcr{padding-left: 25px; } #showpr {float: right; width: 450px; margin-bottom: 21px; background-color: ;;} #showpl {float: left; width: 450px; margin-bottom: 21px; background-color: ;;} #showbox h3 { color:#EE2F72; font-family:Arial,Helvetica,sans-serif; font-size:13px; font-weight:bold; height:20px; margin-bottom:0px; margin-left:25px; padding-top:0px; text-decoration:none; width:400px; } #showbox h2 { border:1px solid #B2B1B1; background-color: #ccc; color:#000000; font-family:Arial,Helvetica,sans-serif; font-size:14px; font-weight:bold; height:28px; margin-bottom:10px; margin-left:25px; padding-top:0px; text-decoration:none; line-height: 30px; width:95%; } #showbox h4 { color: #5B6E91; font-family:Arial,Helvetica,sans-serif; font-size:12px; font-weight:bold; padding-left:25px; text-decoration:none; } #showbox p { color:#676767; font-family:Arial,Helvetica,sans-serif; font-size:12px; font-weight:normal; padding-bottom:15px; padding-left:25px; padding-right:28px; text-decoration:none; } /*--- showbox ---*/ /*------------------------- Footer --------------------------*/ .footer {font-family:Verdana, Arial, Helvetica, sans-serif;color:#5A658A; text-align:center; font-size:9pt; height:10px; line-height:10px; } .footer a {color:#5A658A; font-size:10px; margin:0 5px;} #index_footer { padding:8px 0 10px 0;}