@import url("http://fonts.googleapis.com/css?family=Dosis:500");
@import url("fontes.css");

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

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

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, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1; font-family:'', sans-serif;}
ol, ul {list-style: none;}
blockquote, q {	quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {	content: '';content: none;}
table {	border-collapse: collapse;	border-spacing: 0;}
textarea, input{resize:none;}
/*Fim Reset*/

/* CSS Document */
body{ background:url(../image/bg_body.jpg); font-family: 'Dosis', sans-serif;}

/* TOPO */
.topo{ position:relative; height:155px; z-index:100;}
.tarja{ height:104px; background:url(../image/tarja_topo.png) center repeat-x; position:relative; top:20px;}
.conteudo-topo{width:970px; left:50%; margin-left:-485px; position: relative; top:-20px;}
.logo{ background:url(../image/fundo_logo.png) no-repeat; position:absolute; width:300px; height:155px; left:45px;}
	.logo img{ width:200px; height:145px; position:relative; top:0px; left:50px;}
ul.menu{height:35px; position:relative; top:0; width:550px; left:415px; top:55px;}
		.menu li, .menu li a {float:left; position: relative; display: block; margin-left:30px; font-family: 'populairemedium'; font-size:36px; text-decoration:none; color:#FFF; cursor:pointer;}
		.menu li a:hover, .menulinks li a.ativo{color:#558fa7;}
.sombra{ width:797px; height:12px; position:relative; background:url(../image/sombra-menu.png) no-repeat center; z-index:-90; top:86px; left:86px;}
		
/* SLIDER */
.slide{ height:527px; position:relative; margin-top:-25px; background:url(../image/circulo.png) no-repeat center; width:1200px; left:50%; margin-left:-600px; margin-bottom:-100px;}
#slider{ position:relative; height:405px; width:952px; top:103px; left:124px;}

/* CONTEUDO */
.conteudo{ width:970px; display:table; position:relative; left:50%; clear:both; margin-left:-485px; top: 140px;}
		.separacao{ background:url(../image/separa.png) no-repeat; width:970px; height:30px; position:relative;}
		
/* SOBRE */

.sobre{ width:970px; height:850px; position:relative;}
.menu-topicos{ width:970px; height:100px;}
.titulo{ background:url(../image/seta_titulo.png) no-repeat; width:270px; height:100px; position:relative; left:50px; float:left; font-family: 'populairemedium'; font-size:36px; -moz-transform: rotate(356deg); -webkit-transform: rotate(356deg); color:#143a51;}
.menus ul{height:35px; position:relative; top:0; width:550px; left:120px; top:15px; float:left;}
		.menus li, .menus li a {float:left; position: relative; display: block; margin-left:30px; font-family: 'populairemedium'; font-size:36px; text-decoration:none; color:#143a51; cursor:pointer;}
		.menus li a:hover, .menus li a.ativo{color:#000;}
.sobre-ativo{ width:100px; height:50px; left:550px; top:-60px; position:relative; *top:40px; *left:-270px;}

.figuras{ width:470px; height:440px; position:relative; float:left; left:50px;}
	.figuras img { position:relative; width:220px; height:210px; margin:0 10px 10px 0;}
.texto-sobre{ width:390px; height:400px; position:relative; float:left; top:0px; left:50px;}
	.texto-sobre p{ margin:0 5px 0 5px; text-align:justify; line-height:17px;} 
.conhecimentos{ width:870px; position:relative; left:50px; clear:both; top:20px;}
	.titulo-conhecimento{width:870px; position:relative; clear:both; height:70px; }
	.titulo-conhecimento .titulo{background:none; height:50px; left:0px; position:relative; float:left;}
.curriculo, .curriculo a{ position:relative; float:left; font-family: 'populairemedium'; font-size:36px; text-decoration:none; color:#143a51; text-align: right; margin-right:20px; width:210px; left:170px;} 
	.curriculo a:hover{color:#000;}

	.habilidades { width:210px; height:30px; position:relative; float:left; margin-right:5px; margin-bottom:7px;}
	.habilidades p{ float:left; height:30px; font-size:14px; margin:6px 5px 0 0; width:95px; text-align:right;}
	.habilidades li { float:left;}



/* PORTFOLIO */

.portfolio{ width:100%; display:table; position:relative; margin-bottom:100px;}
ul.trabalhos{ width:890px; position:relative; left:40px; clear:both; margin-bottom:100px;}
	.trabalhos li{ width:210px; height:230px; float:left; margin:0 0 10px 10px; background-color:#143a51;}
	.trabalhos li img{ margin:5px; width:200px; height:155px;}
	.trabalhos li h2, .trabalhos li h2 a{ color:#FFF; font-size:30px; margin:5px; font-family: 'populairemedium'; text-align:center; text-decoration:none;}
	.trabalhos li h2 a:hover{ color:#558fa7;}
	.trabalhos li p{ margin:5px; color:#c7c6c6; text-align:center;}

.port-ativo{ width:80px; left:670px; top:-60px; position:relative;}
	
	
/* CONTATO */		

.rodape {background: url(../image/tarja_rodape.jpg) center bottom repeat-x; height:110px; position:relative; margin-top:30px; width:100%; z-index:-99;}
.sombra-rodape{ width:800px; height:20px; position:relative; background:url(../image/sombra-rodape.png) no-repeat center; z-index:-100; top:224px; left:50%; margin-left:-400px; bottom:30px; *display:none;}

.mensagem{ width:371px; height:350px; background:url(../image/bg_mensagem.png) no-repeat; float:left; left:70px; position:relative;}
.titulo-msg{ width:270px; position:relative; top:30px; left:80px; font-family: 'populairemedium'; font-size:36px; -moz-transform: rotate(356deg); -webkit-transform: rotate(358deg); color:#fff; clear:both;}

#msg-contato{ position:relative; width:240px; left:60px; top:50px;}
.campo{width:240px; display:block; }
.msg-input, .msg-textarea{font: 16px; width: 240px; padding: 4px 4px; margin: 0 0 5px 0; color: #143a51; text-shadow: 0 0 1px #FFFFFF; border: 1px solid #143a51; outline: none; display: inline-block; position: relative; z-index: 2;  font-family: 'Dosis', sans-serif; font-size:15px; background:#e4e4e4; font-weight:bold;}
.msg-input {height: 16px;}
.msg-textarea { height:90px; overflow: hidden;}
.msg-input:focus, .msg-textarea:focus{ -webkit-box-shadow: 0px 0px 5px #000;-moz-box-shadow: 0px 0px 5px #000; box-shadow: 0px 0px 5px #000;}
.osubmit{font-size:16px;font-weight:bold; padding: 0px 3px; margin:15px 0 0 80px; height:26px; cursor: pointer; width:91px; z-index:99; border:0px; background-color:#E4E4E4; color:#143a51; text-align:center; font-family: 'Dosis', sans-serif;}
label.error {color:#F33; font-size:12px; line-height:8px; margin-top:-10px;}

.menus-msg ul{height:35px; position:relative; width:550px; left:100px; top:15px; float:left;}
		.menus-msg li, .menus-msg li a {float:left; position: relative; display: block; margin-left:30px; font-family: 'populairemedium'; font-size:36px; text-decoration:none; color:#143a51; cursor:pointer;}
		.menus-msg li a:hover{color:#000;}
		
.depoimentos{ height:140px; position:relative; width:400px; left:115px; top:40px; float:left;}
		.depoimentos h2{position: relative; margin-left:30px; font-family: 'populairemedium'; font-size:29px; text-decoration:none; color:#143a51;}
		.depoimentos p{ text-align:right; width:330px; margin-top:5px; color:#143a51;}
		
.redes-sociais{height:30px; position:relative; width:470px; left:100px; top:110px; float:left;}
		.redes-sociais a { float:left; margin-left:10px; width:100px; height:30px; overflow:hidden; _position:relative;}
	.redes-sociais a:hover img { margin-top:-30px; _position:absolute;}