*{	text-decoration: none; color: white; margin: 0 auto;}
body{  font-size: 100%; font-family :Arial, Helvetica, sans-serif; background: #1BAAB8 url(img/bgTopo.jpg) repeat-x top;}
#tudo{width: 1030px; height:100%; }
#wrapper{width: 670px; margin: 0 auto;}
h1{ font-size: 32px; } 
h2{font-size: 20px; background: url(img/accept.png) 0 2px no-repeat; padding-left: 26px;  float: left;}

.div-h1-servicos, .div-h1-contato, .div-h1-portfolio{ margin: 3px 0 10px 0; background: url(img/line.png) 0 0; background-repeat: repeat-x; /*background-position: top left;*/ float: left; height: 9px; width: 100%}
.div-h1-portfolio{float: right; width: 640px;}

/* =========================================== HEADER =========================================== */
#header, .intro{width: 640px; float: right; margin: 40px 0 0 0; }
.intro{line-height:26px; font-size:20px; font-family:Georgia;  font-weight:normal; }
.logo{float: left;}
.social a{background-repeat: no-repeat; float: right; width: 31px; height: 31px; margin: 16px 0 0 7px;} 
.mail a{background: url(img/nav_mail.png) 0 0;}
.mail a:hover{background:  url(img/nav_mail.png) -32px 0; cursor: help;}
.twitter a{background: url(img/nav_twitter.png) 0 0;}
.twitter a:hover{background:  url(img/nav_twitter.png) -32px 0;}
.facebook a{background: url(img/nav_facebook.png) 0 0;}
.facebook a:hover{background:  url(img/nav_facebook.png) -32px 0;}
.blog a{background: url(img/nav_blog.png) 0 0;}
.blog a:hover{background:  url(img/nav_blog.png) -32px 0;}
iframe{margin-left: 30px;}

/* =========================================== PORTFOLIO =========================================== */
#portfolio{width: 670px; float: left; margin-top: 50px; margin-bottom: 30px;}
#portfolio h1{ padding-left: 60px; background: url(img/bg-h1-portfolio.png) 30px 11px no-repeat;}
.work-full{width: 670px; float: left; margin-bottom: 60px;}
.detalhes {width: 30px; height: 100px; float: left;}
.info {background: url(img/info.png) 0 0; background-repeat: no-repeat; width: 25px; height: 25px; float: left; margin-bottom: 5px;}
.info:hover{background:  url(img/info.png) -25px 0; cursor:help;}
.data {background: url(img/data.png) 0 0; background-repeat: no-repeat; width: 25px; height: 25px; float: left; margin-bottom: 5px;}
.data:hover{background:  url(img/data.png) -25px 0; cursor:help;}

.work-img{float: right; width: 640px;}
.work-img img{border: 2px solid #099; opacity:0.8; filter: alpha(opacity=80); width: 637px;}  
.work-img img:hover{border-color: white; opacity:1; filter: alpha(opacity=100);} 
.cliente{float: left; margin-left: 30px; font-weight: 700; font-size: 18px; letter-spacing: 1px; display: inline; background: url(img/arrow.png) no-repeat 3px 3px; padding-left: 23px; padding-top: 1px;}
.visitar a{float: right; padding: 1px 6px;  background-color: white; color: #099;}
.visitar a:hover{ background-color: #099; }

/* =========================================== SERVICOS =========================================== */
#servicos { float: left; width: 340px; text-align: justify; margin-left: 30px; display: inline;}
#servicos h1{ background: url(img/bg-h1-servicos.png) 0 11px no-repeat; padding-left: 26px;}
.tres-servicos p{margin: 6px 0 40px 0; float: left; width: 100%;} 
.tres-servicos a{border-bottom: 1px dashed; cursor: help;}

/* =========================================== CONTATO =========================================== */
#contato{ width: 270px; float: right; height: 500px; /*margin-left: 60px;*/} 
#contato h1{background: url(img/bg-h1-contato.png) 0 11px no-repeat; padding-left: 29px;}
.formulario {float: right; margin-top: -17px;}
p.error							{margin-left:0px; margin-top:5px; width: 220px; text-align: right;}
#contact_form ul					{float:left; margin-left: 0; padding: 0;}
#contact_form ul li					{margin: 0 0 4px 0; list-style:none; clear:both; }
#contact_form input#name,
#contact_form input#email,
#contact_form textarea				{float:left; padding:4px; border:1px solid white;background: #1BAAB8;}
#contact_form input#name,
#contact_form input#email			{width:258px;}
#contact_form textarea				{width:258px;height:213px; resize: none;}
#contact_form input.button		{float:right;}
.contact ul 						{list-style:none;}
.contact li 						{margin:0;}
.clearfix:after					{clear:both; content:' '; display:block; font-size:0; line-height:0; visibility:hidden; width:0; height:0;}
* html .clearfix 					{height:1%;}
.clear							{clear:both; display:block; overflow:hidden; visibility:hidden; width:0; height:0;}
.error, .success				{display:none; float: right;}
.button, .button:visited 		{background-color: white; width: 269px; display:inline-block; padding:3px 0 3px 0; color:#099; text-decoration:none; position:relative; cursor:pointer; font-size:13px; font-weight:bold; line-height:1; border:0;}
.button:hover					{background-color: #099; color:white; text-decoration:none;}
.button:active					{top:1px;}

/* =========================================== FOOTER =========================================== */
#footer{width: 100%; height: 100px; float: right; background: url(img/footer.jpg) no-repeat center bottom;}

/* =========================================== DIVERSOS =========================================== */
#erro404{margin: 30px 0 60px 0; float: left; width: 630px;}
#erro404 p{margin: 20px 0 0 30px;}
#erro404 a{font-weight: 700; border-bottom: 1px dashed;}
#voltarTopo a{ margin:50px 0 0 20px; position: relative; height: 128px; width: 128px; float: right; display: block;}
#voltarTopo a{background: url(img/balloon.png) 0 0; position: fixed;}