@charset "UTF-8";
/*   
Theme Name: AppBuilders
Description: A beautiful and fun theme for any creative agency, startup or freelancing business. 
Author: João Alberto
Author URI: http://jalberto.blacksheepz.org
Version: 1.0
*/

/*----------------------------------------------
 Let's Start Off with the Grid (992-16-10-10)
----------------------------------------------*/
body {min-width: 960px;}.container_16{margin-left: auto;margin-right: auto;width: 992px;}.grid_6{display: inline;float: left;margin-left: 10px;margin-right: 10px;}.container_16 .grid_6 {width: 352px;}.clear {clear: both;display: block;overflow: hidden;visibility: hidden;width: 0;height: 0;}

/*----------------------------------------------
 Now let's Reset Stuff
----------------------------------------------*/
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; font-family:"微软雅黑"; }									

article, aside, figure, footer, header, hgroup, nav, section {display: block;}

img,
object,
embed { max-width: 100%;margin-top: 13px;}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;overflow-x:hidden; }

ul {list-style: none;}


blockquote, q {quotes: none;}

blockquote:before, 
blockquote:after, 
q:before, 
q:after {content: ''; content: none;}

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; outline: 0;}

del {text-decoration: line-through;}

abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}

input, select {vertical-align: middle;}

pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline; }
.ie6 input {vertical-align: text-bottom;}

select, input, textarea {font: 99% sans-serif;}

table {font-size: inherit; font: 100%;}
 
/* Accessible focus treatment people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {outline: none;}

small {font-size: 85%;}

strong, th {font-weight: bold;}

td, td img {vertical-align: top;} 

/* Make sure sup and sub don't screw with your line-heights gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}

/* hand cursor on clickable elements */
.clickable,
label, 
input[type=button], 
input[type=submit], 
button {cursor: pointer;}

input[type="text"], input[type="password"], textarea, select { outline: none;} /*Remove Webkit default Styles*/

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}

/* make buttons play nice in IE */
button {width: auto; overflow: visible;}
 
/* scale images in IE7 more attractively */
.ie7 img {-ms-interpolation-mode: bicubic;}

/* prevent BG image flicker upon hover */
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}

/*---------------------------------------------------------------------------------------
 Alright, let's start coding!
---------------------------------------------------------------------------------------*/
  /*
    
    1) Basic Styles
    2) Fonts
    3) Sprites
    4) Header & Navigation
    5) Lead Text
    6) Services Overview Section
    7) Work Section
    8) Team Section
    9) Contact Section
   10) Footer
   11) Back to Top

  */

/*--------------------------------
 1) Basic Styles
--------------------------------*/

body { background: #f1f1f1 url('images/bg_top.jpg') no-repeat left top; background-repeat:repeat;}

body, select, input, textarea {color: #666;}

a {color: #666; text-decoration: none;}
a:hover {color: #666; text-decoration:underline;}
a:active {outline:none;}
a:link {-webkit-tap-highlight-color: #fcd700;} 

/*Bebas Neue Font is not available via Google Web Fonts so we load it via font-face*/
@font-face {
  font-family: 'BebasNeueRegular';
  src: url('../fonts/BebasNeue-webfont.eot');
  src: url('../fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
       url('../fonts/BebasNeue-webfont.woff') format('woff'),
       url('../fonts/BebasNeue-webfont.ttf') format('truetype'),
       url('../fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
  font-weight: normal;
  font-style: normal;
}


#lead-section #arrow,.hkcp_left span,.hkcp_right span,.v1,.v2,.v3,.bt_hz,
#back-top span{ background: url('images/sprite.png') no-repeat top left;}

/*--------------------------------
 4) Header & Navigation
--------------------------------*/
header { width:1280px; height:68px; background-color:#ffffff; margin:0 auto;}
.top_a{ width:1025px; margin:0 auto; height:68px;}
header h1 a{ float:left;} /*Your Logo*/
nav { float:right; font-size: 14px; font-weight: bold; font-family:"微软雅黑"; } 
nav li { display: inline; float: left; width:auto;}
nav a { display: block; color: #000; padding:0 15px 0 15px; line-height:68px; text-align:center;}
nav a:hover{ background-color:#A00A13; color:#000; text-decoration:none;}
nav a.active { padding-left:10px; padding-right:10px; background-color:#A00A13;}
/*--------------------------------
 5) Lead Text
--------------------------------*/
#lead-section { padding: 0 0 36px 0;}


/*--------------------------------
 6) Services Overview Section
--------------------------------*/

#services-overview { padding-bottom: 36px;}

/*--------------------------------
 7) Work Section
--------------------------------*/
#work { padding-bottom: 36px;}

/*--------------------------------
 8) team Section
--------------------------------*/
#team { padding-bottom: 36px;}
.ie7 #team { margin-top: 75px;} /*Quick & Dirty Fix, sorry but IE7 is just not worth the time*/

/*--------------------------------
 9) Contact Section
--------------------------------*/
#contact{ background: url('images/bg_bottom.jpg') no-repeat left top; background-repeat:repeat; position: relative; z-index: 2000; padding-bottom: 36px;}

footer { position:relative; z-index: 3000; height: 119px; min-height: 119px; height: auto !important;}



/*--------------------------------
 11) Back To Top
--------------------------------*/
#back-top { position: fixed; bottom: 30px; right:0;margin-left: 1100px; z-index: 10000;}
#back-top a { width: 81px; display: block; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s; }
#back-top a:hover { opacity: 0.8; /* IE 8 */-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /* IE 5-7 */filter: alpha(opacity=80);}
/* arrow icon (span tag) */
#back-top span { width: 65px; height: 65px; display: block; margin-bottom: 7px; background-position: 0 -181px; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s; }
.main{ width:100%; height:auto;}
.jdt{ width:100%; height:431px; margin-bottom:36px;}
.hkcp,.wxtx,.hzhb,.gyfn,.zxgw{ width:998px;height:540px;padding-bottom: 20px;
 -webkit-border-radius: 5px; border-radius:5px; margin:0 auto; border:1px solid #E0E0E0; background-color:#FFF;}
.wxtx{height:428px;}
.hzhb{height:275px;}
.gyfn{height:276px;}
.zxgw{height:264px;}
.hkcp h1,.wxtx h1{ height:56px; width:998px; border-bottom:1px solid #E0E0E0; text-align:center; line-height:56px; font-size:18px; color:#333;}
.hkcp_left{float:left; width:490px; height:484px; border-right:1px solid #E0E0E0; text-align:left;}
.hkcp_left span,.
 span{width:85px; height:84px; background-position: 0 -80px; float:right;}
.tu{ float:left;width:304px; height:238px; padding-top:12px; padding-left:86px;}
.hkcp_left strong{ float:left; width:490px; height:24px; padding-top:40px; padding-bottom:20px;font-size:16px;text-align:center;}
.hkcp_left p,.hkcp_right p{float:left; padding:11px 60px 5px 60px; font-size:14px; line-height:30px;text-align:left;}
.hkcp_right{ width:497px; height:484px; float:right;}
.hkcp_left a:hover,.hkcp_right a:hover{ color:#A00A13;}
.hkcp_right strong{ float:left; width:480px; height:24px; padding-top:20px; padding-bottom:0px;font-size:16px;text-align:center;}
.wxtx ul{ float:left;width:998px;height:371px;}
.wxtx ul li{ float:left;width:332px;height:371px; border-right:1px solid #E0E0E0;}
.wxtx ul li a{ float:left;width:332px;height:371px;}
.wxtx ul li a:hover{ float:left;width:332px;height:371px; background-image:url(images/ee_r8_c4.jpg); background-repeat:repeat-x; color:#A00A13;}
.wxtx ul li p{float:left; padding:0 20px 10px 20px; font-size:14px; line-height:24px;text-align:left;}
.v1,.v2,.v3{width:26px; height:26px; background-position: 0 -262px; float:right; margin-top:20px; margin-right:30px;}
.v2{background-position: 0 -321px;}
.v3{background-position: 0 -382px;}
.wxtx ul li strong{ float:left; width:332px; height:24px; padding-top:40px; padding-bottom:20px;font-size:16px;text-align:center;}
.tu2{ float:left;width:162px; height:124px; padding-top:38px; padding-left:86px;}

.bt_hz{width:74px; height:64px; background-position: 0 -441px; float:left; margin-top:50px; margin-left:86px;}
.dx_hz{ float:right; width:795px; margin-left:30px;}
.dx_hz div{ display:block; width:795px; height:30px;}

.tp{ width:156px; height:43px; text-align:center; padding-left:40px;}


/*.dx_hz div{ width:156px; height:43px; margin-left:70px; float:left; margin-top:40px;    }
*/


.dx_hz img,.hf_hz img{ float:left; margin-top:64px; margin-left:30px;}
.hf_hz{ float:left; width:389px;}
.dx_hz p,.hf_hz p{ float:left; width:90%; padding:30px 60px 10px 0; font-size:14px; line-height:30px;text-align:left;}
.zxgw img{ float:left; margin-top:30px;}
.zxgw p {
    float: left;
    width: 324px;
    font-size: 14px;
    line-height: 30px;
    padding-left: 25px;
    padding-top: 30px;
    color: #333;
    text-align: justify;
}
.ffte{ width:998px;height:45px; margin:0 auto; border-bottom:1px solid #E0E0E0;}
.ffte p{ float:right;width:auto; font-size:14px; line-height:45px;color:#333; padding-right:50px;}
.ffte p a{ padding-left:10px; padding-right:10px;}
.ffte p a:hover{ color:#A00A13; text-decoration:none;}
.ffte2{ width:998px;height:45px; margin:0 auto;}
.ffte2 p{ float:left;width:auto; font-size:12px; line-height:45px;color:#000;}
.ffte2 span{ float:right; padding-top:10px;}