* {margin: 0; padding: 0;}
html {height: 100%;}
body {min-height:100%; height: 100%; color: #000; font-weight: normal; font-family: Arial, Verdana, Helvetica, Sans-Serif; font-size: 13px;}
.cleaner {clear: both; height: 1px; font-size: 1px;}
p {font-size: 13px;}
textarea {font-size: 13px; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
h1 {font-size: 20px;}
h2, h3, h4, h5{font-size: 16px; font-weight: normal;}
img {border: 0;}

a {text-decoration: underline; color: #83B90F;}
a:hover {text-decoration: none;}

.main {width: 1004px; margin: auto; height: auto !important; min-height:100%; height: 100%;}

/* header */
.header {background: #E4E4E4 url(../i/head-bg.gif) no-repeat top; width: 1004px; padding: 43px 0 29px 0;}
.main .section {background: #E4E4E4 url(../i/head-sbg.gif) no-repeat bottom;}
#logo {width: 170px; height: 19px; background: url(../i/logo.jpg) no-repeat; display: block; margin: 5px 0 0 50px;}
.banner1 {font-family: Myriad Pro, Helvetica, Sans-Serif; font-size: 26px; color: #999; padding: 0 0 0 128px; margin-top: 52px;}
.banner2 {font-family: Myriad Pro, Helvetica, Sans-Serif; font-size: 20px; color: #999; padding: 15px 0 7px 128px;}
.banner1 span {color: #7CB600;}
.banner2 span {color: #606060;}

.contact-block {float: right; font-size: 13px; padding-right: 24px; text-align: right;}
.contact-block p {color: #A7A7A7;}
.contact-block a {color: #7CB600; text-decoration: underline;}
.contact-block a:hover {text-decoration: none;}

.line {font-size: 19px; font-family: Myriad Pro, Helvetica, Sans-Serif; background: #C6C6C6; margin: 0 29px; padding: 12px 0 4px 0;}
.line a {color: #4C4C4C; text-decoration: none; padding: 0 18px 0 28px; background: url(../i/mark.gif) no-repeat right; line-height: 19px;}
.line a:hover {text-decoration: none;}
.header .last {padding-bottom: 20px;}


.header .active {font-weight: bold; background: #777; padding-top: 12px;}
.header .active a {color: #FFFEFE; font-weight: bold; background: url(../i/mark-sel.gif) no-repeat right;}


.header .active2 a {background: url(../i/mark2.gif) no-repeat right;}
.none2 {padding: 2px 0 0 28px; font-family: Tahoma, Arial, sans-serif; font-size: 13px; color: #FFF; }
.none2 p {font-weight: normal; line-height: 20px; padding: 20px 90px 0 0;}
.header .none {padding: 2px 0 0 28px; font-family: Tahoma, Arial, sans-serif; font-size: 13px; color: #FFF; clear: both; overflow: hidden;}
.header h2 {color: #CCC; font-size: 16px; font-family: Myriad Pro, Helvetica, Sans-Serif;}
.header .none p {font-weight: normal; line-height: 20px; padding: 20px 90px 0 0;}
.header ul li {list-style-image: url(../i/list.gif); margin: 2px 0 0 15px; font-weight: normal;}
.header em {font-size: 16px; font-family: Tahoma, Arial, sans-serif; color: #FFF; display: block; background: url(../i/cr-left.gif) no-repeat left top; padding-left: 40px;}
.header em span {display: block; background: url(../i/cr-right.gif) no-repeat right top; padding: 0 0 0 30px; float: right;}
.dev-el {background: url(../i/dev.png) no-repeat; float: right; margin-top: -130px; width: 125px; height: 124px;}
.main .header .first{padding-top: 20px; margin-top: 35px;} 
.main .header .active {padding-bottom: 0;}



.centercol {background: #FFF; padding: 37px 0px;}
.centercol .title {padding: 0 0 11px 32px; font-size: 19px; color: #666; font-family: Myriad Pro, Arial, sans-serif; font-weight: normal;}
.flash {margin: 14px 0 20px 0;}
.contact {width: 250px; height: 108px; background: url(../i/cantact-img.jpg) no-repeat;}
.centercol .col1 {float: left; padding: 0 0 0 32px;}
.centercol .col1 h5{color: #7CB600; font-size: 19px; font-family: Myriad Pro, Arial, sans-serif; font-weight: normal; padding: 18px 0 0 111px;}
.centercol .col1 p {color: #676767; width: 106px; padding: 12px 0 0 112px;}
.centercol .col2 {float: left; width: 315px; padding: 0 0 0 88px;}
.centercol h3{color: #666; font-size: 19px; font-family: Myriad Pro, Arial, sans-serif; padding-bottom: 15px; font-weight: normal;}
.centercol .col2 span{color: #7CB600;}
.centercol .col2 p{color: #6c6c6c; padding: 0 0 16px 0;}
.centercol .col2 a{color: #83B90F; text-decoration: underline;}
.centercol .col2 a:hover{text-decoration: none;}

.col3 {float: right; padding: 39px 33px 0 0;}
.col3 ul li {list-style: none; padding: 0 0 6px 21px;}
.col3 .home {background: url(../i/home.gif) no-repeat;}
.col3 .about-us {background: url(../i/q.gif) no-repeat 0 1px;}
.col3 .contact-us {background: url(../i/contact.gif) no-repeat 0 1px;}
.main .contactm {padding-top: 0;}


/* about us */
.about-content {padding: 0 20px 15px 30px;}
.about-content p {line-height: 18px; color: #666; padding: 0 0 18px 0;}
.sep {height: 1px; font-size: 1px; background: url(../i/sep.gif) repeat-x; margin-bottom: 16px; clear: both;}
.about-content h4 {padding: 0 0 11px 0; font-size: 19px; color: #666; font-family: Myriad Pro, Arial, sans-serif; font-weight: normal;}
.about-content h5 {font-size: 14px; font-weight: bold; color: #666; padding: 0 0 9px 0;}
.about-content span {color: #7CB600;}
.about-content img{padding: 3px; border: 1px solid #E1E1E1; margin: 0 19px 15px 0;}

/* contacts */
.contact-text {border-top: 1px solid #D7D7D7; border-left: 1px solid #D7D7D7; border-right: 1px solid #D7D7D7; background: url(../i/contact-bg.gif) repeat-x; padding: 18px 11px 0 11px; margin: -12px 13px 37px 13px;}
.contact-text p {font-size:12px; line-height: 18px; color: #666; padding: 0 0 18px 0;}

.contact-text2 {border-top: 1px solid #D7D7D7; border-left: 1px solid #D7D7D7; border-right: 1px solid #D7D7D7; background: url(../i/contact-bg.gif) repeat-x; padding: 18px 11px 0 11px; margin: -12px 13px 0px 13px;}
.contact-text2 p {font-size:12px; line-height: 18px; color: #666; padding: 0 0 18px 0;}



.contact-form {padding: 0 0 0 20px;}
.contact-form .left-col{float: left; text-align: right; width: 212px;}
.contact-form .left-col p {padding: 0 8px 0 0; line-height: 18px; color: #666;}
.contact-form .right-col{float: left;}
.right-col input {border: 1px solid #B3B9C3; width: 212px; height: 19px; margin-bottom: 7px;}
.right-col select {border: 1px solid #B3B9C3; width: 212px; height: 19px; margin-bottom: 7px;}

.main .ctitle p{font-size: 19px; color: #666; font-family: Myriad Pro, Arial, sans-serif; font-weight: normal; padding: 0 10px 13px 0;}

.right-col textarea {border: 1px solid #B3B9C3; width: 650px; height: 188px;}
.button {border: 0; width: 100px; height: 35px; margin: 18px 0 0 112px; background: url(../i/submit.gif) no-repeat; cursor: pointer;}


/* footer */
.footer_guarantor {height: 56px; clear: both;}
.footer {margin: auto; margin-top: -56px; width: 1004px; height: 56px; clear: both; background: #FFF; border-top: 1px solid #E5E5E5; color: #A7A7A7;}
.footer a{color: #A7A7A7; text-decoration: none;}
.copy {padding: 15px 0 0 51px; float: left;}
.address {padding: 15px 102px 0 0; float: right;}
.address img {position: relative; top: 2px; padding-left: 2px;}


#ddd {
background-image: url(../portfolio/winder_color.jpg);
background-image: url(../portfolio/converge_color.jpg);
background-image: url(../portfolio/thread_color.jpg); 
background-image: url(../portfolio/textopoly_color.jpg); 
background-image: url(../portfolio/meebee_color.jpg); 
background-image: url(../portfolio/school_color.jpg);
background-image: url(../portfolio/others_color.jpg);
background-image: url(../portfolio/activity_color.jpg);
background-image: url(../portfolio/wisetopic_color.jpg);  
background-image: url(../portfolio/oneroof_color.jpg);
background-image: url(../portfolio/enter_color.jpg);
background-image: url(../portfolio/makesome_color.jpg);

background-image: url(../i/arrowtoleft_green.jpg);
background-image: url(../i/arrowtoright_green.jpg);
  
background-image: none;
clip: rect(0 0 0 0);
} 



.line span {color: #4C4C4C; cursor:pointer; cursor:hand; text-decoration: none; padding: 0 18px 0 28px; background: url(../i/mark.gif) no-repeat right; line-height: 19px;}

.colS {float: right; padding: 0px 0px 0px 0px;}
.colS ul li {list-style: none; }