@charset "utf-8";
/* CSS Document */
/************************/
/*  Carlos Braga  	    */
/*  Portfólio on-line   */
/*  2009                */ 
/************************/

body {
	padding:0px;
	margin:0px;
	background:url(/imgs/fundo.jpg) top center no-repeat;
}
*{
	margin:0px;
	padding:0px;
	list-style:none;
	vertical-align:baseline;
}
#Geral{
	width:960px;
	margin:0 auto;
}
#Topo{
	width:640px;
	left:320px;
	position: relative;
	height:150px;
	background:url(/imgs/Carlos_Braga.png) 20px 10px no-repeat;
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight:bold;
	color:#444;
}
	#Topo h4{
		width:150px;
		height:40px;
		position:relative;
		top:97px;
		left:15px;
/*		margin:20px 0 0 15px;*/
		font-size:12px;
		font-weight:lighter;
		background:url(/imgs/WebDesigner.png) top left no-repeat;		
	}
	#Topo h4 span{
		visibility:hidden;
	}

#Direita{
/*	background:url(/imgs/amo_o_que_faco.png) top left no-repeat;*/
	width:254px;
	height:28px;
	position:absolute;
	top:110px;
	right:20px;
}
#Direita span{
	display:none;
}
#Direita:hover{
/*	background:url(/imgs/amo_o_que_faco.png) bottom no-repeat;*/
}
	#Topo a {
		color: #ff0099;
	}
		#Topo a:hover {
			background-color: #ec008c;
			color: #fff;
		}
	#Amo {
		margin: 0;
		padding: 0;
		text-indent: -9999px;
		width:254px;
		height:28px;
		position: relative;
		background: url(/imgs/amo_o_que_faco.jpg);
		background-position:0 0;
	}
	#Amo:hover,#Amo.hover{
		background: url(/imgs/amo_o_que_faco.jpg) no-repeat;
		background-position:0 -28px;
	}
		#Topo #Amo a {
			position: absolute;
			top: 0;
			left: 0;
			width:254px;
			height:28px;
			display: block;
			border: 0;
			background: transparent;
			overflow: hidden;
		}
			#Topo #Amo .fake-hover{
				margin: 0;
				padding: 0;
				width:254px;
				height:28px;
				display: block;
				position: absolute;
				top: 0;
				left: 0;
				background: url(/imgs/amo_o_que_faco.png) no-repeat 0 -28px;
			}

.caixa{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	width:280px;
	padding:0 20px 0 20px;
	height:259px;
	float:left;
	color:#478aac;
	position:relative;
	z-index:110;
}
.caixa a{
	color:#478aac;
	font-weight:bold;
	text-decoration:none;
}
.caixa a:hover{
	text-decoration:underline;
}
.caixa p{
	margin-bottom:10px;
}
.caixa:hover{

	}
.caixa h1{
	margin:0 auto;
	height:33px;
	margin-bottom:10px;
	margin-top:15px;
}
.caixa h1 span{
	display:none;
}
.caixa#Quefaco h1{
	background:url(/imgs/TitulosCaixas.png) 0px 0px no-repeat;
	width:135px;
}
.caixa#QueFiz h1{
	background:url(/imgs/TitulosCaixas.png) -150px 0px no-repeat;
	width:117px;
}
.caixa#QuemSou h1{
	background:url(/imgs/TitulosCaixas.png) -282px 0px no-repeat;
	width:98px;
}

#Contato{
	background:url(/imgs/Contato.gif) 0 0 no-repeat;
	width:21px;
	height:104px;
	position:absolute;
	right:-23px;
	top:5px;
	cursor:pointer;
	z-index:10;
}
#Contato:hover{
	background:url(/imgs/Contato.gif) -21px 0 no-repeat;
}
#ContatoContainer{
	height:425px;
	display:none;
	position:absolute;
	right:0px;
	top:0px;
	z-index:1000;
	background-color:#FFF;
}
#IFContato{
	width:100%;
	height:100%;
	float:left;
	display:none;
	border:none;
	overflow:hidden;
}
#BtnFechar{
	background:url(/imgs/BtnFechar.gif) 0 0 no-repeat;
	width:26px;
	height:26px;
	display:none;
	float:right;
	cursor:pointer;
	margin:10px 10px 0 0;
}
#BtnFechar:hover{
	background:url(/imgs/BtnFechar.gif) 0 -26px no-repeat;
}

#tooltip {
	position:absolute;
	z-index:3000;
	background: url(/imgs/balao.png);
	width:165px;
	height:123px;
}
#tooltip h3{
	visibility:hidden;
}
#tooltip.viewport-right{
	background: url(/imgs/balao2.png);
}

#BtnTwitter{
	background:url(/imgs/iconeTwitter.gif);
	height:70px;
	width:62px;
	display:inline-block;
	text-decoration:none;
	float:left;
	margin-right:10px;
}
#BtnTwitter:hover{
	background:url(/imgs/iconeTwitter.gif) 0 70px;
}
#BtnLinkedIn{
	background:url(/imgs/iconeLinkedin.gif);
	height:70px;
	width:62px;
	display:inline-block;
	text-decoration:none;
	float:left;
	margin-right:10px;
}
#BtnLinkedIn:hover{
	background:url(/imgs/iconeLinkedin.gif) 0 70px;
}
#BtnLastfm{
	background:url(/imgs/iconeLastfm.gif);
	height:70px;
	width:62px;
	display:inline-block;
	text-decoration:none;
	float:left;
	margin-right:10px;
}
#BtnLastfm:hover{
	background:url(/imgs/iconeLastfm.gif) 0 70px;
}
#BtnMyspace{
	background:url(/imgs/iconeMyspace.gif);
	height:70px;
	width:62px;
	display:inline-block;
	text-decoration:none;
	float:left;
}
#BtnMyspace:hover{
	background:url(/imgs/iconeMyspace.gif) 0 70px;
}

#BtnTwitter span, #BtnLinkedIn span, #BtnLastfm span, #BtnMyspace span, #BtnVerCase span, #BtnAnt span, #BtnProx span, #tituloPortfolio span, #Contato span, #BtnFechar span{
	visibility:hidden;
	display:none;
}
#Icones{
	width:278px;
	position:absolute;
	bottom:30px;
	left:20px;
	z-index:10;
}

/* PORTFOLIO */

#tituloPortfolio{
	position:absolute;
	bottom:-5px;
	left:118px;
	background:url(/imgs/tituloPortfolio.png) no-repeat;
	width:84px;
	height:29px;
	z-index:100;
}

#Portfolio{
	float:left;
	width:960px;
	height:160px;
	z-index:10;
	position:relative;
}

a#BtnVerCase{
	background:url(/imgs/BtnVerCase.jpg) no-repeat;
	width:960px;
	height:30px;
	text-decoration:none;
	display:block;
	position:absolute;
	bottom:0px;
	left:0px;
	z-index:11;
}
a#BtnVerCase:hover{
	background:url(/imgs/BtnVerCase.jpg) 0 -30px no-repeat;
}

#Navegacao{

}
#BtnAnt{
	background:url(/imgs/BtnSetas.jpg) 0 0 no-repeat;
	width:77px;
	height:68px;
	text-decoration:none;
	display:block;
	position:absolute;
	left:55px;
	bottom:56px;
	z-index:12;
}
#BtnAnt:hover{
	background:url(/imgs/BtnSetas.jpg) 0 -68px no-repeat;
}
#BtnProx{
	background:url(/imgs/BtnSetas.jpg) -77px 0 no-repeat;
	width:77px;
	height:68px;
	text-decoration:none;
	display:block;
	position:absolute;
	bottom:56px;
	right:55px;
	z-index:12;
}
#BtnProx:hover{
	background:url(/imgs/BtnSetas.jpg) -77px -68px;
}

#Container{
	float:left;
	width:960px;
	height:131px;
	overflow:hidden;
	z-index:1;
}
#Container img{
	border:none;
}

/* PORTFOLIO FIM */

.aviso {border:1px solid #dedeb9;background:#ffffd4;text-align:center; position:absolute; top:70px; left:10px; z-index:1000; font-family: Arial, Helvetica, sans-serif; font-size:14px; line-height:18px; padding:10px;}

#W3cCss{
	background:url(/imgs/w3cCss.png) 0 0 no-repeat;
	width:25px;
	height:70px;
	text-decoration:none;
	display:block;
	float:right;
	margin:110px 40px 0 0;
	z-index:12;
}
#W3cCss:hover{
	background:url(/imgs/w3cCss.png) -25px 0 no-repeat;
}
#W3cXhtml{
	background:url(/imgs/w3cXhtml.png) 0 0 no-repeat;
	width:25px;
	height:70px;
	text-decoration:none;
	display:block;
	float:right;
	margin:110px 10px 0 0;
	z-index:12;
}
#W3cXhtml:hover{
	background:url(/imgs/w3cXhtml.png) -25px 0 no-repeat;
}