html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; }

html { background:#f5f2de url(../images/top-bg.jpg) repeat-x top; }


/* --- Basics and Typography --- */

body { font:80% Arial, Verdana, sans-serif; text-align:left;  }

li { list-style:none; }

acronym { border-bottom:1px dotted #000; cursor:help; }

a { text-decoration:none; color:#00598c; }
a:hover { color:#0087d4; }

img { vertical-align:middle; }

em { font-style:italic; }

p { margin:10px 0; line-height:20px; }

strong { font-weight:bold; }

h1 { font-size:1.8em; color:#a63200; margin:0; padding:0; }
h2 { margin-top:30px; font-size:1.3em; color:#568c00; text-transform:uppercase; padding-bottom:0px; border-bottom:1px solid #ebc085; }
h2 img { margin-left:12px; }
h3 { color:#00598c; cursor:pointer; font-size:1.2em; border-bottom:1px dotted #aaa; margin:20px 0; padding:0 0 3px 25px; background:url(../images/arrow.png) no-repeat left; }
h3:hover { color:#aaa; }

/* --- Layout --- */

#wrapper { margin: 0 auto; width:800px; }

#header { height:177px; padding-top:35px; background:url(../images/header-bg.png) no-repeat top; }

#logo { float:left; width:167px; height:107px; display:block; background:url(../images/green-tea-design.png) no-repeat; text-indent:-5000em; }

#footer { clear:both; text-align:center; padding:50px 0 10px 0; color:#de8114; }

/* --- Navigation --- */

#navigation { float:right; margin-top:76px; background:url(../images/navigation.jpg) no-repeat; width:522px; height:66px; }
#navigation li { float:left; text-align:center; }
#navigation li a { font-size:1.2em; color:#fff; text-indent:-5000em; display:block; width:174px; height:66px; background:url(../images/navigation.jpg) no-repeat; overflow:auto; }
li#portfolio-link a { background-position:-174px 0;  }
li#contato-link a { background-position:-348px 0;  }
li#home-link a:hover,li#home-link a.hover { background-position:0 -66px;  }
li#portfolio-link a:hover,li#portfolio-link a.hover { background-position:-174px -66px; }
li#contato-link a:hover,li#contato-link a.hover { background-position:-348px -66px;  }

#back-top { position:fixed; bottom:5px; right:5px; padding:3px; background-color:#096da7; }
#back-top a { color:#fff; font-size:0.8em; }

/* --- H1 Bar --- */

.h1-bar { width:800px; height:77px; padding:44px 0 0 155px; }
#home-bar { background:url(../images/h1-bar-home.png) no-repeat; }
#portfolio-bar { background:url(../images/h1-bar-portfolio.png) no-repeat; }
#contato-bar { background:url(../images/h1-bar-contato.png) no-repeat; }
#h1-home { height:42px; background:url(../images/h1-bg-home.jpg) no-repeat left top; text-indent:-5000em; }
#h1-portfolio { height:42px; background:url(../images/h1-bg-portfolio.jpg) no-repeat left top; text-indent:-5000em; }
#h1-contato { height:42px; background:url(../images/h1-bg-contato.jpg) no-repeat left top; text-indent:-5000em; }


/* --- Home --- */

#home h3, #home h2 { clear:both; }
.servico { text-align:justify; }
.servico img { float:left; margin-right:20px; padding-bottom:30px; }
.servico ul { }
.servico ul li { padding:0 10px 5px 25px; }
#price-form form { padding:15px; background:url(../images/price-box-top.jpg) no-repeat top; }
#price-form { background:url(../images/price-box.jpg) no-repeat bottom; }
#price-form fieldset { margin-bottom:15px; padding-bottom:15px; border-bottom:1px solid #fff; }
#price-form legend { color:#406800; font-size:1.3em; padding-bottom:15px; }
#price-form input[type=text] { border:1px solid #aaa; width:25px; padding:2px; }
#price-form input[type=button] { width:73px; height:24px; background:url(../images/calcular.png) no-repeat 0 0; border:none; text-indent:-5000em;}
#price-form input[type=button]:active { background-position:0 -24px; }
#first-field { float:left; width:420px; height:91px; margin-bottom: 300px; }
#second-field { float:left; height:91px; }
#resultado { width:70px; height:15px; float:right; margin:-50px 20px 0 0; color:#fff; text-align:center; font-size:1.2em; background-color:#406800; padding:10px; border:2px solid #fff; }

/* --- Portfolio --- */

.job { float:left; padding-right:30px; margin-top:40px; width:370px; }
.client-name { font-size:1.3em; color:#de8114; }
.job p { margin:5px 0; }
.job p span { color:#000; }
.job img { border:3px solid #bbb; margin-right:8px; }
.job img:hover { border-color:#4987a4; }
.job .app-icon { border:none; }

/* --- Página de contato --- */

#contact-form { height:375px; margin-top:20px; padding:30px 0 0 30px; background:url(../images/form-bg.jpg) no-repeat; }
#left-field { width:465px; float:left; }
#right-field { width:250px; float:right; margin-left:50px; }
#contact-form label { display:block; color:#b12a00; }
#contact-form input[type=text], textarea { border:1px solid #c99d68; padding:6px; }
#contact-form textarea { width:96.5%; height:130px; }
#contact-form input[type=text] { width:96.5%; height:15px; margin-bottom:15px; }
#contact-form fieldset p:first-child { margin:0; color:#b12a00; font-size:1.2em; }
input[type=submit] { width:92px; height:33px; float:right; background:url(../images/button.png) no-repeat 0 0; border:none; text-indent:-5000em;}
input[type=submit]:hover { cursor:pointer; }
input[type=submit]:active { background-position:-92px 0; }