/*********************
-- ORGANIZAÇÃO--------

-- GLOBALS
-- ESTRUTURA

-- CORES--------------

-- boxes e bordas #cfd0d0
-- texto padrao #434343

*********************/

/*********************
* -- GLOBALS
*********************/
html, body { height: 100%; }

html { background: url(../imagens/bg-noise.jpg) center fixed; }
body {
	background: transparent;
	color: #434343;
	font-family: Arial;
	font-size: 12px;
}

label, button { cursor: pointer; }

a:link, a:visited {
	text-decoration: none;
}

.menu , #contato-rapido label, #contato-rapido button, #contato-rapido h2 {
	text-transform: uppercase;
}

.contemfloat:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.contemfloat { display: inline-block; }
* .contemfloat { height: 1%; }
.contemfloat { display: block; }

.twitted p.preLoader {
	margin: 0;
	padding: 1em 1em 1em 3em;
	background: transparent url(../imagens/loader.gif) center no-repeat;
	text-indent: -9999px;
}

.hidden { display: none; }

.error { border: 1px solid red; }

/*********************
* -- ESTRUTURA
*********************/
#header, #container { width: 960px; margin: 0 auto; }
#wraper {
	background: transparent url(../imagens/bg-blur.jpg) repeat-y center;
	background-attachment: fixed;
	margin: auto;
	width: 100%;
	position: relative;
	min-height: 100%;
	/*background-image: url(../imagens/960_16_10_10.png);
	background-repeat: repeat-y;*/
}
#header {
	height: 140px;
}
	.faixa-topo{
		height: 10px;
		background: #da0305;
	}
	#logo {
		background: url(../imagens/logo-mcp-comunicacao.png) no-repeat;
		float: left;
		height: 64px;
		margin-top: 35px;
		text-indent: -9999px;
		width: 230px;
	}
	#logo a { display: block; height: 64px; }
	#header address {
		float: left;
		font-size: 10px;
		font-style: normal;
		font-weight: bold;
		margin-top: 45px;
		width: 180px;
	}
		#header address p { margin-top: 10px; font-weight: bold; }
	
#container {
	padding-bottom: 102px;
}

#conteudo { float: left; position: relative; width: 730px; }

#footer {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 82px;
}
	#footer .inside {
		position: relative;
		margin: 0 auto;
		width: 960px;
		z-index: 2;
	}
		.logo-footer {
			background: url(../imagens/logo-mcp-rodape.png) no-repeat;
			display: inline;
			float: right;
			height: 31px;
			margin: 30px 35px 0 0;
			text-indent: -9999px;
			width: 96px;
		}
		#footer .menu { display: inline; float: left; margin: 33px 0 0 50px; }
		#footer .menu li {
			float: left;
			font-size: 10px;
			font-weight: bold;
			padding: 6px 10px;
		}
		#footer .menu li a:link, #footer .menu li a:visited { color: #FFF; }
		#footer .menu li.selecionado { background: #3e3e3e; }
		#footer p { color: #5e5e5e; float: left; font-size: 8px; padding: 10px 0; margin: 30px 0 0 25px; }
		#footer p a:link, #footer p a:visited { color: #5E5E5E; }
		#footer p a:hover { color: red; text-decoration: underline; }
.faixa-footer{
	/*background: #000 url(../imagens/bg-line-footer.jpg) repeat-x;
	border-top: 7px solid #737272;
	height: 75px;
	opacity: 0.3;
	filter: alpha(opacity = 30);*/
	background: #000 url(../imagens/bg-line-footer.jpg) repeat-x;
	border-top: 7px solid #737272;
	position: absolute;
	width: 100%;
	height: 75px;
	z-index: 0;
	opacity: 0.3;
	filter: alpha(opacity = 30);
	top: 0;
	left: 0;

}
	
#sidebar {
	float: right;
	text-align: right;
	width: 205px;
}
	#sidebar .menu { margin-bottom: 20px; }
		#sidebar .menu  li { color: #87878a; padding: 8px 10px 8px 0; }
		#sidebar .menu .selecionado { background: #ff0000; color: #FFF; }
		#sidebar .menu a:link, #sidebar .menu a:visited { color: #87878a; font-weight: bold; font-size: 16px; }
		#sidebar .menu .selecionado a:link, #sidebar .menu .selecionado a:visited { color: #FFF; }
		
#contato-rapido { float: right; margin: 0 0 15px 0; }
	#contato-rapido li { margin-top: 15px; }
	#contato-rapido h2 { background: #a0a0a1; color: #FFF; font-weight: bold; padding: 5px 0 3px; text-align: center; }
	#contato-rapido label { display: block; margin-bottom: 3px; }
	input, textarea {
		border: 1px solid #d6d7d7;
		padding: 3px;
		width: 152px;
	}
	#contato-rapido textarea { height: 75px; }
	#contato-rapido label { font-size: 10px; font-weight: bold; }
	#contato-rapido button {
		background:  url(../imagens/btn-enviar.png) no-repeat;
		border: none;
		height: 19px;
		text-indent: -9999px;
		width: 72px;
	}
	
#twitter {
	background: #cfd0d0;
	clear: both;
	float: right;
	padding: 10px 10px 10px 20px;
	text-align: left;
	width: 160px;
}
	#twitter h3 { font-weight: bold; font-size: 10px; text-transform: uppercase; margin-bottom: 5px; }
	#twitter p { line-height: 1.3em; }
	#twitter a.siga:link, #twitter a.siga:visited {
		background: url(../imagens/setas-sprite.png) no-repeat 0 -20px;
		color: #434343;
		display: block;
		float: right;
		font-size: 11px;
		font-weight: bold;
		padding-left: 15px;
		margin-top: 5px;
		text-align: right;
	}
	
/*********************
* -- CONTEUDO
*********************/
#comerciais #conteudo, #visual #conteudo { margin-top: -10px; }
#comerciais #conteudo h1 , #visual #conteudo h1 { margin-top: 10px; }
#conteudo h1 {
	font-size: 16px;
	font-weight: bold;
	position: absolute;
	right: 60px;
	text-align: right;
	text-transform: uppercase;
	top: -35px;
}	
.trabalho {}
	.banner {
		background: url(../imagens/loader.gif) no-repeat center;
		border: 10px solid #cfd0d0;
	}
	.trabalho-desc {
		background: #cfd0d0;
		float: left;
		margin-top: 2px;
		padding: 0 15px 20px;
		position: relative;
		width: 580px;
		z-index: 5;
	}
		.trabalho-desc h2 {
			background: url(../imagens/seta-topo.png) no-repeat 0 13px;
			font-weight: bold;
			margin-bottom: 4px;
			padding-top: 35px;
			text-transform: uppercase;
		}
		.trabalho-desc p { line-height: 1.3em; margin-bottom: 3px; }
		.botao-video, .botao-foto {
			background: url(../imagens/botoes-ver-multimidia.jpg) no-repeat;
			display: block;
			float: left;
			height: 44px;
			margin: 12px 15px 0 0;
			text-indent: -9999px;
			width: 120px;
		}
		.botao-foto { background-position: -143px 0; }
	.mais-trabalhos {
		float: left;
		margin: 18px 0 0 10px;
	}
	#trabalhos .mais-trabalhos{
		position: absolute;
		right: 0;
		top: 330px;
	}
		#trigger-maisTrabalhos {
			background: url(../imagens/btn-mais-trabalhos.png) no-repeat;
			border: none;
			cursor: pointer;
			display: block;
			height: 19px;
			padding: 0;
			text-indent: -9999px;
			width: 109px;
		}
		#lista-maisTrabalhos {
			background: #cfd0d0;
			margin-left: 6px;
			padding: 0 5px 10px;
			width: 86px;
		}
			#lista-maisTrabalhos li {
				border-bottom: 1px solid #cfd0d0;
				padding: 10px 0 3px;
				text-align: center;
				text-transform: uppercase;
			}
			#lista-maisTrabalhos a:link, #lista-maisTrabalhos a:visited { color: #434343; font-size: 10px; }
			#lista-maisTrabalhos li:hover, #lista-maisTrabalhos .selecionado { border-bottom: 1px solid #FFF; }
			
#menu-clientes {
	/*float: right;*/
	margin: -32px 0 0 0;
	position: absolute;
	right: 0;
	text-align: right;
	text-transform: uppercase;
	width: 200px;
}
	#menu-clientes h2 { font-size: 16px; font-weight: bold; margin: 0 0 55px 0; }
	#menu-clientes ul { float: right; width: 140px; }
		#menu-clientes li { padding: 5px 10px 5px 0; font-size: 11px; }
		#menu-clientes li.selecionado { background: #FF0000; }
			#menu-clientes li a:link, #menu-clientes li a:visited { color: #a9a9aa; font-weight: bold; }
			#menu-clientes li.selecionado a:link, #menu-clientes li.selecionado a:visited { color: #FFF; }
	
/*#quemsomos #conteudo h1 { padding-right: 60px; }	*/
#mosaico-profissionais { margin-bottom: 40px; width: 675px; }
	.rosa, .lucas, .fabricio, .emilson,
	.leonice, .andreia, .ary, .mosaico-vazio {
		background-repeat: no-repeat;
		background-position: 0 -147px;
		height: 147px;
		float: left;
	}
	.rosa { background-image: url(../imagens/quemsomos/5.jpg); width: 165px; }
	.lucas { background-image: url(../imagens/quemsomos/6.jpg); width: 171px; }
	.fabricio { background-image: url(../imagens/quemsomos/7.jpg); width: 164px; }
	.emilson { background-image: url(../imagens/quemsomos/8.jpg); width: 171px; }
	.leonice { background-image: url(../imagens/quemsomos/1.jpg); width: 165px; }
	.andreia { background-image: url(../imagens/quemsomos/2.jpg); width: 170px; }
	.ary { background-image: url(../imagens/quemsomos/3.jpg); width: 164px; }
	.mosaico-vazio { background-image: url(../imagens/quemsomos/4.jpg); background-position: 0 0; border-left: 1px solid #000; width: 171px; }
	
	.rosa:hover, .lucas:hover, .fabricio:hover,
	.emilson:hover, .leonice:hover, .andreia:hover,
	.ary:hover, .mosaico-vazio:hover {
		background-position: 0 0;
	}
	
	#mosaico-profissionais li.selecionado { background-position: 0 0; }
	#mosaico-profissionais li { height: 147px; text-indent: -9999px; }
	
.thumb-galeria {
	height: auto !important;
	height: 290px;
	min-height: 290px;
	margin: 0 0 40px;
	padding-top: 10px;
}
	.thumb-galeria li {
		display: inline;
		margin: 0 50px 50px 0;
		float: left;
	}
	.thumb-galeria li a { display: block; }
	.thumb-galeria li img { border:10px solid #CFD0D0; }
	/*.thumb-galeria li.selecionado { -moz-box-shadow: 0 0 10px #000; box-shadow: box-shadow: 0 0 10px #000; -webkit-box-shadow: 0 0 10px #000;  }*/
	.thumb-galeria li.selecionado img { border-color: #A0A0A1; }
	#galeria-navegacao {
		display: block;
		height: 42px;
		position: absolute;
		top: 138px;
		width: 100%;
	}
	#galeria-navegacao a.prev, #galeria-navegacao a.next {
		background-image: url(../imagens/setas-galeria.gif);
		background-repeat: no-repeat;
		cursor: pointer;
		height: 23px;
		margin: 8px 0 0 0;
		position: relative;
		text-indent: -9999px;
		width: 20px;
		z-index: 5;
	}
	#galeria-navegacao a.prev{ float: left; }
	#galeria-navegacao a.next{ float: right; background-position: -70px 0; margin-right: 60px; }
	#galeria-navegacao a.disabled { cursor: default; opacity: 0.3; filter: alpha(opacity = 30); }
	

/* override the root element to enable scrolling */ 
#flowpanes { 
    position:relative; 
    overflow:hidden; 
    clear:both; 
	width: 730px;
	height: 330px;
	
}
.carrosel {
	position: relative;
	overflow: hidden;
	width: 710px;
	height: 310px;
	border:10px solid #CFD0D0;
}
	.carrosel img { float: left; display: block; width: 710px; }
#trabalhos #flowpanes { width: 730px; height: auto !important; height: 500px; min-height: 500px; }
 
/* override single pane */ 
 #flowpanes ul.thumb-galeria, #flowpanes .trabalho { 
    float:left; 
    display:block; 
    width:730px; 
} 
 
/* our additional wrapper element for the items */ 
.items { 
    width:20000em; 
    position:absolute; 
    clear:both; 
    margin:0; 
    padding:0; 
} 
 
#flowpanes .less, #flowpanes .less a { 
    color:#999 !important; 
    font-size:11px; 
}
