@charset "utf-8";
/* CSS Document */

Body {background:#000 url(../images/main-bg.png) repeat-x; margin:0px auto; font:12px arial; color:#999;}

a {color:#26a0ff; text-decoration:none;}
a:hover {color:#fff; text-decoration:none;}
.header{width: 915px; height:98px; margin:0px auto;}
.logo{width:195px; float:left;}

H2{ font: bold 14px Arial, Helvetica, sans-serif; text-transform: uppercase;}

.navigation { width:680px; height:98px; float:right; display:block;}

.navigation a.home { width:59px; height:98px; display:block; float:left; background:url(../images/home.png) left top;}
.navigation a:hover.home { width:59px; height:98px; display:block; float:left; background:url(../images/home.png) left top;}
.navigation a.home-active { width:59px; height:98px; display:block; float:left; background:url(../images/home.png) left bottom;}

.navigation a.about-us { width:84px; height:98px; display:block; float:left; background:url(../images/about.png) left top;}
.navigation a:hover.about-us { width:84px; height:98px; display:block; float:left; background:url(../images/about.png) left bottom;}
.navigation a.aboutus-active { width:84px; height:98px; display:block; float:left; background:url(../images/about.png) left bottom;}

.navigation a.portfolio { width:82px; height:98px; display:block; float:left; background:url(../images/portfolio.png) left top;}
.navigation a:hover.portfolio { width:82px; height:98px; display:block; float:left; background:url(../images/portfolio.png) left bottom;}
.navigation a.portfolio-active { width:82px; height:98px; display:block; float:left; background:url(../images/portfolio.png) left bottom;}

.navigation a.client { width:75px; height:98px; display:block; float:left; background:url(../images/client-nav.png) left top;}
.navigation a:hover.client { width:75px; height:98px; display:block; float:left; background:url(../images/client-nav.png) left bottom;}
.navigation a.client-active { width:75px; height:98px; display:block; float:left; background:url(../images/client-nav.png) left bottom;}

.navigation a.blog { width:56px; height:98px; display:block; float:left; background:url(../images/blog.png) left top;}
.navigation a:hover.blog { width:56px; height:98px; display:block; float:left; background:url(../images/blog.png) left bottom;}
.navigation a.blog-active { width:56px; height:98px; display:block; float:left; background:url(../images/blog.png) left bottom;}



.navigation a.media { width:70px; height:98px; display:block; float:left; background:url(../images/media.png) left top;}
.navigation a:hover.media { width:70px; height:98px; display:block; float:left; background:url(../images/media.png) left bottom;}
.navigation a.media-active { width:70px; height:98px; display:block; float:left; background:url(../images/media.png) left bottom;}

.navigation a.dev { width:154px; height:98px; display:block; float:left; background:url(../images/developer.png) left top;}
.navigation a:hover.dev { width:154px; height:98px; display:block; float:left; background:url(../images/developer.png) left bottom;}
.navigation a.dev-active { width:154px; height:98px; display:block; float:left; background:url(../images/developer.png) left bottom;}

.navigation a.career { width:75px; height:98px; display:block; float:left; background:url(../images/career.png) left top;}
.navigation a:hover.career { width:75px; height:98px; display:block; float:left; background:url(../images/career.png) left bottom;}
.navigation a.career-active { width:75px; height:98px; display:block; float:left; background:url(../images/career.png) left bottom;}

.navigation a.contact-us { width:85px; height:98px; display:block; float:left; background:url(../images/contact.png) left top;}
.navigation a:hover.contact-us { width:85px; height:98px; display:block; float:left; background:url(../images/contact.png) left bottom;}
.navigation a.contact-us-active { width:85px; height:98px; display:block; float:left; background:url(../images/contact.png) left bottom;}


.imgheader {background:url(../images/header2-bg.png) no-repeat; height:351px; width:895px; margin:0px auto; padding:10px;}

.imgheader-inside {background:url(../images/inside-header_2.png) no-repeat; height:194px; width:895px; margin:0px auto; padding:8px;}


.content-container{width:915px; height:350px; margin:20px auto;}
.content-lft { background:url(../images/box-left.jpg) no-repeat; width: 9px; height:320px; float:left}
.content-right { background:url(../images/box-right.jpg) no-repeat; width: 9px; height:320px; float:right}

.about{ width: 309px; height:330px; background:url(../images/box-mid.jpg) repeat-x; float:left; margin-right:20px;}
.about div.txt{ padding:5px 3px}

.about_new{ width: 309px; height:160px; background:url(../images/box-mid-new.jpg) repeat-x; float:left; margin-right:20px;}
.about_new div.txt{ padding:5px 3px}

.product{ width: 356px; height:330px; background:url(../images/box-mid.jpg) repeat-x; float:left; margin-right:20px;}
.product div.txt{ padding:5px 3px}
.product div.items {padding:5px 5px 15px 5px; margin-bottom:5px; border-bottom:1px solid #333;}

.contact{ width: 206px; height:330px; background:url(../images/box-mid.jpg) repeat-x; float:left; margin-right:0px;}
.contact div.txt{ padding:5px 3px}

.sns-links { padding:10px 5px; height:18px; border:1px solid #333; border-width:1px 0px 1px 0px;}
.sns-links a.fb{ display:block; height:16px; width:16px; background: url(../images/social_facebook_box_blue.gif) no-repeat left top; margin-right:10px; float:left;}
.sns-links a:hover.fb{ display:block; height:16px; width:16px; background: url(../images/social_facebook_box_blue.gif) no-repeat left bottom;}

.sns-links a.tw{ display:block; height:16px; width:16px; background: url(../images/social_twitter_box_white.gif) no-repeat left top; margin-right:10px;float:left;}
.sns-links a:hover.tw{ display:block; height:16px; width:16px; background: url(../images/social_twitter_box_white.gif) no-repeat left bottom;}

.sns-links a.rss{ display:block; height:16px; width:16px; background: url(../images/social_rss_box_orange.gif) no-repeat left top; margin-right:10px;float:left;}
.sns-links a:hover.rss{ display:block; height:16px; width:16px; background: url(../images/social_rss_box_orange.gif) no-repeat left bottom;}

.sns-links a.flk{ display:block; height:16px; width:16px; background: url(../images/social_flickr_box.gif) no-repeat left bottom; margin-right:10px;float:left;}
.sns-links a:hover.flk{ display:block; height:16px; width:16px; background: url(../images/social_flickr_box.gif) no-repeat left top;}




.inside{ width: 915px;  background:url(../images/box-mid.jpg) repeat-x; margin-right:20px;}
.inside div.txt{ padding:5px 20px}
.inside ul{ list-style-image:url(../images/arrow_000_small.png);margin:20px; padding:0px;}
.inside li{}

.medialink {}
.medialink a{ color:#999}
.medialink a:hover{ color:#fff}
.medialink div{ width:174px; height:160px; display:block; float:left; margin-right:15px; margin-bottom:20px;}
.medialink div img{ margin-bottom:7px;}
.clear{clear:both}


.portfolio {}
.portfolio div{ width:874px; display:block; float:left; margin-bottom:20px; border-bottom:1px solid #333;}
.portfolio div img{ margin-right:7px;}
.portfolio div.clear{clear:both; border:0px;}


.contact-form { width: 685px;  background:url(../images/box-mid.jpg) repeat-x; float:left; margin-right:20px;}
.contact-form div.txt{ padding:5px 15px}

.contact_form form{width:560px; float:left}
.contact_form fieldset{width:550px; float:left; border:0px;}
.contact_form .row{width:560px; float:left; margin:10px 0 0}
.contact_form .row span{color:#F00}
.contact_form label{width:560px; float:left; color:#999; font-size:13px; padding:0 0 5px}
.contact_form .textbox{width:250px; height:24px; float:left; color:#000; font-size:13px; line-height:23px; padding:0 5px; border:1px solid #000; background:url(../images/input_bg.jpg) 0 0 repeat-x}
.contact_form .textarea{width:250px; height:74px; float:left; color:#000; font-size:13px; line-height:23px; padding:5px 5px; border:1px solid #000; background:url(../images/textarea_bg.jpg) 0 0 repeat-x; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif}
.contact_form .submit{width:87px; height:31px; float:left; background: url(../images/submit-btn.gif) 0 0 no-repeat; border:none; cursor:pointer}
.contact_form p.success{width:543px; float:left; color:#78aa01; font-weight:bold; font-size:13px; text-align:center; line-height:20px}



.client-tab{ margin-top:13px;}


.clientlink {}
.clientlink a{ color:#999}
.clientlink a:hover{ color:#fff}
.clientlink div{ width:182px; height:125px; display:block; float:left; margin:18px;}
.clientlink div img{ margin-bottom:7px;}
.clear{clear:both}


.footer{background:#131313; padding:10px 10px; display:block; margin:10px auto; text-align:center; float:left; width:896px; clear:both}
.footer a{ margin:0px 10px; color:#666;}
.footer a:hover{ color:#fff;}

.copyright{ padding:0px 10px 10px 10px; display:block; margin:0px auto; float:left; width:896px;}

.header .logo{margin-top:25px;}
.header .logo img{height:auto; width:auto;}