@charset "utf-8";
body { margin:0; padding:0; width:100%; background:#fff;}
html { padding:0; margin:0;}

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

/********** header **********/
.header { background:url(../img/bg_header.gif) bottom repeat-x; height:110px; }
.block_header {margin:0 auto; width:1000px;}
.top_menu { float:right; padding:4px 10px; font:normal 11px Tahoma, Geneva, sans-serif; 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;}
.links { float:right;padding: 8px 4px 0 6px; text-align:right;}
.links span { float:right; background: url(../img/arrow.gif) -2px no-repeat; padding:0 10px 0 10px;}
.links a { font:normal 11px Tahoma, Geneva, sans-serif; color:#ffffff; text-decoration:none;}

/****** search *******/
.search {float:right;width:200px;padding-top:5px; margin-right:40px; text-align:right;}
.inputsearch {font:normal 11px Tahoma, Geneva, sans-serif; color:#ffffff;background: none;width:150px;padding: 1px 6px 0 6px;border-left:1px solid #E7E7E7;border-top:1px solid #E7E7E7;border-bottom:1px solid #E7E7E7; height:16px; border-right:none;}
.search button {background: url(../img/search.gif) 0 0 no-repeat;height: 19px;width: 24px;cursor:pointer;}
.search div { float:left;}

/* logo */
.logo { float:left; padding:0; margin:0;padding-top:19px; }
.logo h1 { font:normal 2.5em Arial, Helvetica, sans-serif; margin:0; padding:1px 0px 0px 18px;  line-height:0.6em;  }
.logo h1 a { text-decoration:none; color:#FFFFFF;}
.logo h2 { font:normal 1.2em "Myriad Pro", Arial, Helvetica, sans-serif; margin:0; padding-left:18px; word-spacing:0.3em; color:#B4D2EE}

/* tags */
/*.tags { float:left; padding:0; margin:0; width:1000px; text-align:center;}
.tags a { font:normal 11px Tahoma, Geneva, sans-serif; color:#6C9BC6; text-decoration:none;} */

/* menu */	
.menu { padding:0; margin:0; width:550px; float:right; height:40px;}
.menu ul { padding:0; margin:0 30px 0 0; list-style:none; border:0; float:right;}
.menu ul li { float:left; margin:0; padding:0 3px; border:0;}
.menu ul li a { float:left; margin:0 1px 0 0; padding:14px 14px; color:#fff; font:normal 14px Arial, Helvetica, sans-serif; text-decoration:none;}
.menu ul li a:hover { color:#fff; text-decoration:none; background: #5186b8 url(../img/menu_bg.gif) top repeat-x;}

/********** slider **********/
.slider { background: url(../img/bg_simple.gif) top repeat-x;  margin:0 auto; padding:0;}
.slider2 { background: #5186b8;  margin:0 auto; padding:0;}
.slider2_resize { width:960px; margin:0 auto; padding:0;}
.slider2_resize h2 { width:700px; float:left; margin:15px 0 15px 0; padding:0; font:bold 30px Arial, Helvetica, sans-serif; color:#fff;}
.slider2_resize p { width:200px; float:left; margin:15px 0 0 0; padding:18px 0 0 0; font: normal 11px Arial, Helvetica, sans-serif; color:#fff;}

/* header_text */
.header_text { margin:0 auto; width:980px; padding:0;}
.header_text .div {width:1000px; margin:0; padding:0;}
.header_text .div .left1 { float:left; width:430px;}
.header_text strong { display:block; margin:0; color:#a1e2e6; font:normal 12px Arial, Helvetica, sans-serif; line-height:16px;}
.header_text span { float:right; margin:0; padding:0; width:300px;}
.header_text h2 { font:bold 36px  Arial, Helvetica, sans-serif; color:#fff; padding:20px 0 0 20px; margin:0; line-height:1.2em;}
.header_text p { font:normal 12px  Arial, Helvetica, sans-serif; color:#fff; padding:0 0 0 20px; margin:0; line-height:1.6em;}
.header_text ul.buttons { float:left; padding:30px 0 10px 10px; margin:0; list-style:none;}
.header_text ul.buttons li { float:left; padding:0 10px; margin:0;}

/********************topi***************/
.top { background: #f7f7f7; border-top:1px solid #E6E6E6;}
.topi { width:960px; margin:0 auto; padding:0; height:130px;}
.topi .blogi { width:238px; padding:0; float:left;}
.topi .blogi a { color:#000000; text-decoration:none;}
.topi .blogi p a { color:#5084b6; text-decoration:none;}
.topi h2 { border:0; font:bold 14px Arial, Helvetica, sans-serif; color:#000; padding:10px 10px; margin:0; border-bottom:1px solid #d8d8d8;}
.topi p { font:normal 11px Arial, Helvetica, sans-serif; color:#6f6f6f; padding:5px 5px; margin:0; line-height:1.3em; text-align:justify;}
.topi img  { float:left; margin:8px 1px; padding:0;}
#dev { background:url(../img/web-development.gif) center no-repeat;float:left; margin:10px 5px; padding:0; width:65px; height:65px;  }
#app { background:url(../img/web-application.gif) center no-repeat;float:left; margin:10px 5px; padding:0; width:65px; height:65px;  }
#mkt { background:url(../img/web-marketing.gif) center no-repeat;float:left; margin:10px 5px; padding:0; width:65px; height:65px;  }
#dng { background:url(../img/web-design.gif) center no-repeat;float:left; margin:10px 5px; padding:0; width:65px; height:65px;  }



.faq {border-bottom:1px solid #DDDDDD;}

/********** block index **********/
.body { padding:0; margin:0; background: #fff url(../img/body_bg.gif) top repeat-x;}
.body h2 { font:bold 24px  Arial, Helvetica, sans-serif; color:#2c2c2c; border-bottom:1px solid #cccccc; padding:10px 5px; margin:5px 0;}
.body a { font:normal 11px Arial, Helvetica, sans-serif; color:#5084b6; text-decoration:none;}
.body p { font:normal 11px  Arial, Helvetica, sans-serif; color:#8d8d8d; line-height:1.8em; padding:5px 5px; margin:0;}
.body_resize { width:970px; margin:0 auto; padding:10px 0;}
.imgright { float:right;}
.listleft ul { float:left;}

/*******************Welcome*****************/
.Welcome { width:531px; margin:10px 20px; float:left; padding:5px 10px;}
.Welcome p { text-align:justify; line-height:1.6em;}
.Welcome img { float: left; margin:10px 10px; padding:0;}
.Welcome ul { float: left;  margin:20px; padding:0;}
.Welcome li { padding:4px; margin:0; font:normal 11px Arial, Helvetica, sans-serif; color:#5c5c5c;}
.Welcome a:hover h2 {color:#5084b6; text-decoration:none; }
ul.talent  { float:left; width:135px;}

/*********************Sub*****************/
.Sub { width:295px;  margin:10px 20px; float:left; padding:5px 10px;}
.Sub p { text-align:justify; line-height:1.6em;}
.Sub ul { list-style:none; margin:5px 5px; padding:0;}
.Sub li { border-bottom:1px solid #eaeaea; background:url(../img/main_ul_li.gif) left no-repeat; padding:5px 25px; margin:0; font:normal 11px Arial, Helvetica, sans-serif; color:#5c5c5c;}
.Sub li a { font: normal 11px Arial, Helvetica, sans-serif; color:#8d8d8d; text-decoration:none;}
.Sub li a:hover { color:#5186b8; text-decoration:underline;}
.Sub strong { color:#5186b8;}
.Sub a:hover h2 {color:#5084b6; text-decoration:none; }
#cell { background:url(../img/mobile.gif) left no-repeat; padding:2px 0px 0px 30px; font-size:22px; }
.Subb { width:255px;  margin:10px 20px; float:left; padding:5px 10px;}
.Subb ul { list-style:none; margin:5px 5px; padding:0;}
.Subb li { border-bottom:1px solid #eaeaea; background:url(../img/main_ul_li.gif) left no-repeat; padding:5px 25px; margin:0; font:normal 11px Arial, Helvetica, sans-serif; color:#5c5c5c;}
.Subb li a { font: normal 11px Arial, Helvetica, sans-serif; color:#8d8d8d; text-decoration:none;}
.Subb li a:hover { color:#5186b8; text-decoration:underline;}
.Subb a:hover h2 {color:#5084b6; text-decoration:none; }

/********** contact form **********/
button,img {margin: 0;padding: 0;border: 0;}
#message {color: #5c5c56;width: 430px;padding: 0 0 30px 20px;float: left;}
.left_textinput {width: 200px;margin: 0 30px 0 0;float: left;}
.right_textinput {width: 200px;float: left;}
.right_textinput label,.left_textinput label,.row label {font:bold 11px Arial, Helvetica, sans-serif; color:#8d8d8d; }
#message .row {margin: 9px 0 0 0;}
#message .row label em {font-style: normal; padding-left: 3px;font:bold 10px Arial, Helvetica, sans-serif; color:#8d8d8d; text-transform:capitalize; }
input, select, textarea {font:normal 11px Arial, Helvetica, sans-serif; color:#000;}
#message div.textinput {background: url(../img/textbox.gif) 0 0 no-repeat;height: 26px;margin: 3px 0 0 0; }
#message input {background: none;width: 188px;height: 21px;padding: 5px 6px 0 6px;border: none;}
#message div.textarea {background: url(../img/textarea.gif) 0 0 no-repeat;height: 95px;margin: 3px 0 0 0; }
#message textarea {background: none;width: 418px;height: 83px;margin: 5px 6px 5px 6px;border: none;overflow:auto}
#message button {background: url(../img/send_message.gif) 0 0 no-repeat;height: 26px;width: 100px;margin: 16px 0 0 0;float: right; cursor:pointer;}
#message button:hover {background-position: 0 -26px;}
.response { text-align:center;  font: bold 11px Arial, Helvetica, sans-serif; line-height:1.8em; width:auto;}
span.error { color:#FF4646; }
span.success { color:#006600; }

/********** footer **********/
.footer { padding:20px 0; margin:0 auto; background:#e9e9e9; border-top:1px solid #d4d4d4;}
.footer .resize p.footer_logo { float:left; padding:0; margin:20px 0px; width:230px;}


.footer .resize p.footer_logo a { float:left; width:16px; height:16px; text-indent:-9999px; display:block; margin:0 2px 5px;}
.footer .resize p.footer_logo a.facebook { background: transparent url(../img/facebook.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.twitter { background: transparent url(../img/twitter.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.linkedin { background: transparent url(../img/linkedin.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.myspace { background: transparent url(../img/myspace.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.flickr { background: transparent url(../img/flickr.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.vimeo { background: transparent url(../img/vimeo.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.delicious { background: transparent url(../img/delicious.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.digg { background: transparent url(../img/digg.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.stumbleupon { background: transparent url(../img/stumbleupon.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.tumblr { background: transparent url(../img/tumblr.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.rss { background: transparent url(../img/rss.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.mixx { background: transparent url(../img/mixx.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.viddler { background: transparent url(../img/viddler.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.newsvine { background: transparent url(../img/newsvine.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.friendfeed { background: transparent url(../img/friendfeed.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.technorati { background: transparent url(../img/technorati.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.reddit { background: transparent url(../img/reddit.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.qik { background: transparent url(../img/qik.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.squidoo { background: transparent url(../img/squidoo.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.slideshare { background: transparent url(../img/slideshare.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.slashdot { background: transparent url(../img/slashdot.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.netvibes { background: transparent url(../img/netvibes.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.designbump { background: transparent url(../img/design-bump.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.designfloat { background: transparent url(../img/designfloat.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.posterous { background: transparent url(../img/posterous.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.behance { background: transparent url(../img/behance.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.friendster { background: transparent url(../img/frinedster.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.mister-wong { background: transparent url(../img/mister-wong.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.blogspot { background: transparent url(../img/blogger.gif) 0 0 no-repeat; }
.footer .resize p.footer_logo a.retweet { background: transparent url(../img/retweet.gif) 0 0 no-repeat; }


.footer .resize .tags { float:left; padding:5px; margin-top:40px;  text-align:justify;border-top:1px solid #cccccc; border-bottom:1px solid #cccccc;}

.tags a {
	text-align:left;
	text-decoration:none;
}
.tags a.tag0 {
	font-size:10px;
	text-align:left;
}
.tags a.tag1 {
	font-size:11px;
	text-align:left;
}
.tags a.tag2 {
	font-size:12px;
	text-align:left;
}
.tags a.tag3 {
	font-size:14px;
	text-align:left;
}
.tags a.tag4 {
	color:#FF6633;
	font-size:16px;
	text-align:left;
}
.tags a.tag5 {
	font-size:18px;
	text-align:left;
}



.footer_logo img {margin:2px;}
.footer .resize div { width:970px; color:#868686; font:normal 11px Tahoma, Geneva, sans-serif; text-align: left; margin:0 auto; }
.footer .resize div p { padding:0; margin:0; line-height:1.6em; }
.footer .resize div img { float:left; }
.footer .resize div a { color:#868686;  padding:0 1px; }
.text_left { text-align: left; }
p.clr, .clr { clear:both; padding:0; margin:0; background:none;}
li.bg, .bg { clear:both; border-top:1px solid #eaeaea; padding:0; margin:5px 0; background:none;}


.footer .resize div.hot_links { float:right; padding:0; margin:10px; width:160px; }
div.hot_links ul {padding:0; margin:0; list-style:none;}
div.hot_links ul li {padding:5px 0px 5px 0px; margin:0;}
div.hot_links h2 {font:bold 16px  Arial, Helvetica, sans-serif; color:#2c2c2c; border-bottom:1px solid #cccccc; padding:0; margin:0; line-height:1.5em;}
div.hot_links a:hover { color:#5084b6 }


/******* slide home *********/
.gallery { float:right; width:537px; height:224px; margin:32px 25px 0 0; }
#slider ul, #slider li{
		margin:0;
		padding:0;
		list-style:none;
}
#slider, #slider li{ 
		width:537px;
		height:244px;
		overflow:hidden; 
}
span#prevBtn{}
span#nextBtn{}	

/******* search result *********/
.result { float:left; width:100%; padding:5px 5px;}
.result h2 a {font:bold 12px  Arial, Helvetica, sans-serif; color:#2c2c2c;  padding:0; margin:0;}
.result p {margin:0; padding:5px 5px;}
.navig { float:left; padding-top:20px;}
.searchfield { width:300px;}


/* PORTFOLIO  */
div.wrap {
width : 526px;
margin : 0 auto;
text-align : left;
}
div#top div#nav {
float : left;
clear : both;
width : 526px;
height : 52px;
margin : 22px 0 0;
}
div#top div#nav ul {
float : left;
width : 233px;
height : 52px;
list-style-type : none;
}
div#nav ul li {
float : left;
height : 52px;
}
div#nav ul li a {
border : 0;
height : 52px;
display : block;
line-height : 52px;
text-indent : -9999px;
}
div#header {
margin : -1px 0 20px;
}
div#video-header {
height : 623px;
margin : -1px 0 0;
}
div#header div.wrap {
height : 239px;
background : url(../img/header-bg.png) no-repeat 50% 0;
}
div#header div#slide-holder {
z-index : 40;
width : 526px;
height : 239px;
position : absolute;
}
div#header div#slide-holder div#slide-runner {
top : 9px;
left : 9px;
width : 506px;
height : 218px;
overflow : hidden;
position : absolute;
}
div#header div#slide-holder img {
margin : 0;
display : none;
position : absolute;				
}
div#header div#slide-holder div#slide-controls {
left : 0;
bottom : 0px;
width : 506px;
height : 46px;
display : none;
position : absolute;
background : url(../img/slide-bg.png) 0 0;
/*behavior: url(css/iepngfix.htc);*/ 
}
div#header div#slide-holder div#slide-controls p.text {
float : left;
color : #fff;
display : inline;
font-size : 10px;
line-height : 16px;
margin : 15px 0 0 20px;
text-transform : uppercase;
}
div#header div#slide-holder div#slide-controls p#slide-nav {
float : right;
height : 24px;
display : inline;
margin : 11px 15px 0 0;
}
div#header div#slide-holder div#slide-controls p#slide-nav a {
float : left;
width : 24px;
height : 24px;
display : inline;
color:#FFFFFF;
font-size : 11px;
margin : 0 5px 0 0;
line-height : 24px;
font-weight : bold;
text-align : center;
text-decoration : none;
background-position : 0 0;
background-repeat : no-repeat;
cursor:pointer;
}
div#header div#slide-holder div#slide-controls p#slide-nav a.on {
background-position : 0 -24px;
}
div#header div#slide-holder div#slide-controls p#slide-nav a {
background-image : url(../img/silde-nav.png);
/*behavior: url(css/iepngfix.htc); */
}
div.imageflow li { float:left; width:100%; margin:0 15px 15px 0; padding:0; background-color:#F3F3F3; border:#D1D1D1 outset 1px}


div.imageflow li label { float:left; margin:0; padding:0;}
div.imageflow li div.title { float:left; margin:10px 0 0 0; padding:5px; }
div.imageflow li div.info { float:left; width:300px;  margin:5px 0 0 0; padding:5px; }
div.imageflow li div.tags { float:left; width:300px;  margin:0; padding:5px;}
div.imageflow li div.tags a {font-style:italic;  }
div.imageflow li div.legend { float:right; margin:10px 15px 15px 0; padding:5px; font-style:italic;}


.imageflow ul { list-style:none; margin:0; padding:0;}