/*
*****************************************************
 Url		: www.marcelocostadesign.com.br
 Criado 	: 29-08-2009 
 CSS + 
 Webdesign	: www.marcelocostadesign.com.br
 Autor		: Marcelo Costa
*****************************************************
 (c) 2004-2009 Marcelo Costa
*****************************************************
*/


/* Elementos gerais do layout */
body {
	margin:0; 
	padding:0;
	background-color: #FFFFFF;
	background-image: url(../img/bg.jpg);
	background-repeat: repeat-x;
	background-position: top center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
}

	img{border:none;}
	img.shadow {border: 5px solid #fff;}

	a {
		color:#000;
		text-decoration: none;
	}
	
	a:hover, .selected a {
		color:#dc601d;
		text-decoration: none;
		background: url(../img/link_hover.gif) repeat-x left bottom;
		cursor: pointer;
	}
	
#tudo {
	width: 950px;
	margin: 0 auto;
	text-align: left;
	background-image: url(../img/bg1.jpg);
	background-repeat: no-repeat;
	background-position: right 40px;
} 

#conteudo {
	width: 905px;
	margin-top: 20px;
	margin-left: 30px;
}

/*------- header styles -------*/

#header {
	height: 200px;
	margin: 0 auto;
} 

#menu {
	width: 950px;
	height: 32px;
	line-height: 32px;
	list-style-type: none;
	margin-top: 1px;
	position: relative;
}

	#menu ul{
		list-style:none;
		width:99px;
	}

	#menu li{
		position:absolute;
		top: 0;
		height:32px;
		width:99px;
	}

	#menu li a{
		display:block;
		text-decoration:none;
		line-height: 32px;
		width:99px;
		height:32px;
		text-align: center;
		color: #000;
		text-indent:-9999em;
	}

	#inicio{width:99px; margin-left: 257px; height:32px; background:url(../img/inicio.gif); background-repeat: no-repeat; background-position: top center; line-height: 32px;}
	#inicio a:hover {background:url(../img/inicio.gif); background-repeat: no-repeat; background-position: 0px -33px; }
	#perfil{width:99px; margin-left: 355px; height:32px; background:url(../img/perfil.gif); background-repeat: no-repeat; background-position: top center; line-height: 32px;}
	#perfil a:hover {background:url(../img/perfil.gif); background-repeat: no-repeat; background-position: 1px -33px;}
	#blog{width:99px; margin-left: 453px; height:32px; background:url(../img/blog.gif); background-repeat: no-repeat; background-position: top center; line-height: 32px;}
	#blog a:hover {background:url(../img/blog.gif); background-repeat: no-repeat; background-position: 1px -33px; }
	#portifolio{width:99px; margin-left: 551px; height:32px; background:url(../img/portifolio.gif); background-repeat: no-repeat; background-position: top center; line-height: 32px;}
	#portifolio a:hover {background:url(../img/portifolio.gif); background-repeat: no-repeat; background-position: 1px -33px; }
	#cases{width:99px; margin-left: 649px; height:32px; background:url(../img/cases.gif); background-repeat: no-repeat; background-position: top center; line-height: 32px;}
	#cases a:hover {background:url(../img/cases.gif); background-repeat: no-repeat; background-position: 1px -33px;}
	#servicos{width:99px; margin-left: 747px; height:32px; background:url(../img/servicos.gif); background-repeat: no-repeat; background-position: top center; line-height: 32px;}
	#servicos a:hover {background:url(../img/servicos.gif); background-repeat: no-repeat; background-position: 1px -33px;}
	#contato{width:99px; margin-left: 846px; height:32px; background:url(../img/contato.gif); background-repeat: no-repeat; background-position: top center; line-height: 32px;}
	#contato a:hover {background:url(../img/contato.gif); background-repeat: no-repeat; background-position: 0px -33px;}
	
#logo {
	width: 337px;
	height: 72px;
	background-image: url(../img/marcelocosta.png);
	background-repeat: no-repeat;
	margin-top: 5px;
	margin-left: 25px;
}

/* SLIDE DE FOTOS CAPA*/
        #prevBtn, #nextBtn{
            margin:0;
            padding:0;
            display:block;
            overflow:hidden;
            text-indent:-8000px;
            }

/* Easy Slider */
#containerslide {
		width:954px;
		height:237px;
		margin: 0 auto;
		margin-top: -90px;
		margin-left: 30px;
		overflow: hidden;
}
	#slider{ }
		
	#slider ul, #slider li{
		margin:0;
		padding:0;
		list-style:none;
		}
		
	#slider li{ 
		width:906px;
		height:247px;
		overflow:hidden; 
		}
		
	#prevBtn, #nextBtn{ 
		display:block;
		width:30px;
		height:77px;
		position: relative;
		top:-155px;
		margin: 0 auto;
		left: -492px;
		}
		
	#nextBtn{
		left:444px;
		top: -223px;
		}
		
	#prevBtn a, #nextBtn a{  
		display:block;
		width:30px;
		height:77px;
		background:url(../img/btn_prev.gif) no-repeat 0 0;	
		}
		
	#nextBtn a{ 
		background:url(../img/btn_next.gif) no-repeat 0 0;	
		}

/* COLUNAS PÁGINA INICIO PORTIFOLIO/CASE/ORÇAMENTO */
#containerdir {
	width: 334px;
	height: 390px;
	position: relative;
	float: right;
	margin-top: 10px;
}

#containeresq {
	width: 552px;
	height: 390px;
	position: relative;
	float: left;
	margin-top: 10px;
}

#containeresq .portifolio {
	width: 266px;
	height:375px;
	background-image: url(../img/portifolio.png);
	background-repeat: no-repeat;
	position: relative;
	float: left;
	padding-top: 50px;
}


#containeresq .cases {
	padding-top: 50px;
	width: 267px;
	height:325px;
	background-image: url(../img/cases.png);
	background-repeat: no-repeat;
	position: relative;
	float: right;
}

#containerdir .orcamentofdo {
	width: 334px;
	height:375px;
	background-image: url(../img/orcamento.png);
	background-repeat: no-repeat;
}

#orcamento1 {
	padding-top: 50px;
}


	#orcamento1 label {
		display: inline-block;
		width: 60px;
		margin-left: 13px;
		margin-top: 15px;
	}
	
	#orcamento1 input {
		width: 240px;
	}
	
	#orcamento1 input#cidade {
		width: 115px;	
	}
	
	#orcamento1 select#estado {
		width: 75px;	
	}
	
	#orcamento1 select#servico {
		width: 245px;	
	}
	
	#orcamento1 textarea#obs {	
		width: 243px;
		height: 100px;
		margin-top: 15px;
	}
	
	#orcamento1 .topo {
		vertical-align:top;
	}
	
	#orcamento1 input#enviar {
		width: 50px;
		margin-top: 10px;
		float: right;
		margin-right: 13px;
	}

#colunaportifolio {
	width: 264px;
	height: 62px;
	margin-left: 1px;
}

	#colunaportifolio .foto{
		width: 55px;
		height: 55px;
		margin-left: 5px;
		margin-top: 3px;
		position: relative;
		float: left;
	}
	
	#colunaportifolio .titulo{
		width: 191px;
		height: 51px;
		margin-right: 5px;
		position: relative;
		float: right;
		padding-left: 4px;
		padding-top: 4px;
		line-height: 51px;
	}

#colunaportifolio1 {
	width: 263px;
	height: 62px;
	margin-left: 1px;
	background-color: #f6e3df;
}

	#colunaportifolio1 .foto{
		width: 55px;
		height: 55px;
		margin-left: 5px;
		margin-top: 3px;
		position: relative;
		float: left;
	}
	
	#colunaportifolio1 .titulo{
		width: 191px;
		height: 51px;
		margin-right: 5px;
		position: relative;
		float: right;
		padding-left: 4px;
		padding-top: 4px;
		line-height: 51px;
	}

#colunacase {
	width: 264px;
	height: 62px;
	margin-left: 2px;
}

	#colunacase .foto{
		width: 55px;
		height: 55px;
		margin-left: 5px;
		margin-top: 3px;
		position: relative;
		float: left;
	}
	
	#colunacase .titulo{
		width: 191px;
		height: 51px;
		margin-right: 5px;
		position: relative;
		float: right;
		padding-left: 4px;
		padding-top: 4px;
		line-height: 51px;


	}

#colunacase1 {
	width: 263px;
	height: 62px;
	margin-left: 2px;
	background-color: #f6f2df;
}

	#colunacase1 .foto{
		width: 55px;
		height: 55px;
		margin-left: 5px;
		margin-top: 3px;
		position: relative;
		float: left;
	}
	
	#colunacase1 .titulo{
		width: 191px;
		height: 51px;
		margin-right: 5px;
		position: relative;
		float: right;
		padding-left: 4px;
		padding-top: 4px;
		line-height: 51px;
	}


/* PERFIL */

#perfiltxt {
	width: 350px;
	height: 440px;
	position: relative;
	float: left;
	line-height: 18px;
	text-align: justify;
}

#perfilfoto {
	width: 500px;
	height: 340px;
	position: relative;
	float: right;
	text-align: left;
	margin-top: -45px;
}

#contatotxt {
	width: 350px;
	height: 400px;
	position: relative;
	float: left;
	line-height: 25px;
	text-align: justify;
}

#contatofoto {
	width: 500px;
	height: 400px;
	position: relative;
	float: right;
	text-align: left;
	padding-top: 25px;
}

#contatofoto .contatotxt {
	background-image: url(../img/contato_hand.png);
	width: 400px;
	height: 273px;
	line-height: 25px;
	margin-top: -15px;
	padding: 5px;
	position: relative;
	float: right;
}

	#contatoform {
		height: 375px;
		line-height: 17px;
	}
	#contatoform label {
		display: inline-block;
		width: 80px;
		margin-top: 15px;
	}
	
	#contatoform input {
		width: 260px;
	}
	
	#contatoform input#cidade {
		width: 125px;
		margin-left: -4px;
	}
	
	#contatoform select#estado {
		width: 75px;	
	}
	
	#contatoform textarea#msg {	
		width: 260px;
		height: 60px;
		margin-top: 15px;
	}
	
	#contatoform .topo {
		vertical-align:top;
	}
	
	#contatoform input#enviar {
		width: 50px;
		margin-top: -50px;
		float: right;
	}
	
	#obrigatorio {
		width: 135px;
		padding: 5px;
		border: 1px solid #d2d2d2;
		margin-top: 15px;
	}

	#captcha {
		display:  inline;
		text-align: left;
		margin-top: 10px;
	}
	
	#captcha input#captcha {
		width: 60px;
	}
	
	#captcha .imgcaptcha {
		float: right;
		margin-top: 10px;
	}


/* SERVIÇOS */

#categorias {
	font: large;
	font-family: sans-serif;
	font-size: 20px;
	font-style: normal;
	font-stretch:  extra-condensed;
	color: #004978;
	line-height: 28px;
}

#listaservicos {
	width: 330px;
	position: relative;
	float: left;
	line-height: 18px;
}

#col1 {
	width: 302px;
	position: relative;
	float: left;
	line-height: 18px;
}

#colneutra {
	width: 603px;
	position: relative;
	float: left;
	line-height: 18px;
}

#col2 {
	width: 302px;
	position: relative;
	float: left;
	line-height: 18px;
}

#col2 {
	width: 302px;
	position: relative;
	float: right;
	line-height: 18px;
}


#listaservicos1 {
	width: 330px;
	position: relative;
	float: right;
	line-height: 18px;
}

#descricaoservico {
	width: 560px;
	position: relative;
	float: right;
	background-image: url(../img/servicos_fdo.png);
	background-repeat: no-repeat;
	background-position: top;
	margin-top: -50px;
}

#descricaoservico1 {
	width: 560px;
	position: relative;
	float: right;
}

	#descricaoservico .negrito {
		font-size: 13px;
		font-weight: bold;
		color: #ffffff;
		margin-top: 6px;
		margin-left: 10px;
		text-align: center;
	}

	#descricaoservico .txt {
		margin-top: 15px;
		margin-left: 10px;
		margin-right: 10px;
		margin-bottom: 30px;
		line-height: 15px;
		text-align: justify;
	}	
	
	#descricaoservico .negritopreto {
		font-size: 13px;
		font-weight: bold;
		color: #000000;
		line-height: 15px;
		display: inline;
	}
	
#cliqueaqui {
	width: 206px;
	height: 74px;
	background-image: url(../img/clique.png);
	position: relative;
	float: left;
}

	
#cliqueaqui1 {
	width: 206px;
	height: 74px;
	background-image: url(../img/clique1.png);
	position: relative;
	float: left;
}

#cliqueaqui2 {
	width: 206px;
	height: 74px;
	background-image: url(../img/clique2.png);
	position: relative;
	float: left;
}

#cases1 {
	line-height: 18px;
	width: 220px;
}

#case_texto {
	line-height: 16px;
	padding: 5px;
	background-color: #f8f2ee;
}

/* BLOG */

#post {
	width: 673px;
	min-height: 100px;
	position: relative;
	float: left;
	margin-bottom: 15px;
}

	#post a {
		color:#1d4896;
		text-decoration: none;
	}
		
	#post a:hover, .selected a {
		color:#dc601d;
		text-decoration: none;
		background: url(../img/link_hover.gif) repeat-x left bottom;
		cursor: pointer;
		}

#post .topo {
	width: 673px;
	height: 11px;
	background-image: url(../img/blog_top.gif);
	background-position: top;
	background-repeat: no-repeat;
}

#post .meio {
	width: 673px;
	height: 200px;
	background-image: url(../img/blog_meio.gif);
	background-position: top;
	background-repeat:  repeat-y;
	display: table;
}

	#post .data {
		width: 94px;
		height: 81px;
		background-image: url(../img/blog_data.gif);
		background-repeat: no-repeat;
		position: relative;
		float: left;
	}
	
		#post .mes {
			width: 45px;
			height: 18px;
			color: #b0b2a1;
			font-family: sans-serif;
			font-size: 15px;
			text-align: center;
			margin-left: 15px;
		}
		
		#post .dia {
			width: 45px;
			height: 30px;
			color: #fc7315;
			font-family: sans-serif;
			font-size: 30px;
			text-align: center;
			margin-left: 15px;
			background-image: url(../img/blog_linha_ano.gif);
			background-position: bottom;
			background-repeat: no-repeat;
		}		
	
		#post .ano {
			width: 45px;
			height: 15px;
			color: #b0b2a1;
			font-family: sans-serif;
			font-size: 10px;				
			text-align: center;
			margin-left: 15px;
		}
	
	#post .conteudo {
		width:550px;
		position: relative;
		float: right;
		padding-left: 10px;
		padding-right: 10px;
		line-height: 18px;
	}

		#post .titulo {
			color: #fc7315;
			font-family: sans-serif;
			font-size: 22px;
			text-align: left;
			margin-bottom: 8px;
		}

#post .base {
	width: 673px;
	height: 13px;
	background-image: url(../img/blog_base.gif);
	background-position: top;
	background-repeat: no-repeat;	
}

#listapost {
	width: 217px;
	position: relative;
	float: right;
	background-color: #efebe7;
	background-image: url(../img/lista_post_01.gif);
	background-position: top;
	background-repeat: no-repeat;
	display: table;
}

	#listapost a {
		color:#1d4896;
		text-decoration: none;
	}
		
	#listapost a:hover, .selected a {
		color:#dc601d;
		text-decoration: none;
		background: url(../img/link_hover.gif) repeat-x left bottom;
		cursor: pointer;
	}

#listapost .conteudo {
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
}

#listapostbase {
	width: 217px;
	height: 10px;
	background-image: url(../img/lista_post_03.gif);
	background-position: top;
	background-repeat: no-repeat;

}

/* RODAPE */
#rodape {
	width: 950px;
	height: 40px;
	margin: 0 auto;
	text-align: center;
	clear: both;
}

#rodape hr {
	width: 905px;
	margin-left: 30px;
	border-top: 1px  dotted #5d8c9f;
}

#erro404 {
	text-align: center;
}

h1 {
	color: $dc601d;
	font-size: 24px;
}