/*
Theme Name: Loja Comunicação
Theme URI: http://www.lojacomunicacao.com.br/
Description: Template feito para a Loja Comunicação
Version: 1.0
Author: Loja Comunicação
Author URI: http://www.lojacomunicacao.com.br/
*/

/*
	Site Loja
	
	Índice do CSS para localizar mais facilmente as seções.
	
	@CSS Reset
	@Estilo Geral
	@Geral
	@Topo
	@Thumbs
	@Conteudo
	@Scrollbar
*/

/***
	@CSS Reset
***/

*{margin:0; padding:0;}

img{border:0;}

table{border:0; border-collapse:collapse;}

/***
	@Estilo Geral
***/

body{font-family:Arial, Helvetica, sans-serif; font-size:12px; background:#000; color:#fff;}

a {color:#58595B; text-decoration:underline;}
a:hover {color:#fff;}

.legenda{display:none;}



/***
	@Geral
***/

#geral{
	/*width:1000px;*/
	width:975px;
	margin:auto;
}



/***
	@Topo
***/

#topo{clear:both; display:inline-block; width:975px; /*height:224px;*/ margin-top:60px;}

#topo img{float:left; margin-right:10px; display:inline;}

#topo #video-intro{float:right; display:inline-block; margin-top:6px; width:432px; height:224px; border: 1px solid #6E6E70;}

#topo #menu{float:left; margin-top:7px; width:215px; display:inline;}

/*MODIFICAR AQUI!!!!!!!!*/
#topo #menu ul li{/*line-height:24px;*/ line-height: normal; margin-bottom: 6px;}

#topo #menu ul li{list-style-type:none;}

/*#topo #menu ul {margin-bottom: 26px !important;}*/
#topo #menu ul {margin-bottom: 0 !important;}

#topo #menu ul li a, #topo #menu #trabalhos label, #conteudo #title h2, #conteudo #title a, #conteudo .btn-trabalhos {font-size:24px; font-weight:bold; text-transform:uppercase; text-decoration:none; padding-left:30px; line-height:24px;}

#topo #menu ul li a:hover{background:url(imgs/seta.gif) no-repeat left 2px;}

.atual{background:url(imgs/seta-atual.gif) no-repeat; color:#fff;}

#topo #menu #trabalhos label{clear:both; float:left; margin: 20px 0 6px 0;}

#topo #menu #trabalhos #combobox{float:left; clear:both; margin-left:30px; display:inline;}



/****		Combobox		*****/
/*#combobox {
	background: url(imgs/combobox.gif) no-repeat;
	width: 210px;
	height: 25px;
	display: inline-block;
	cursor: pointer;
	padding: 5px 0 0 5px;
}

#menu-suspenso {
	height: auto;
	width: 480px;
	font-size: 13px;
	background-color: #000000;
	border: 1px solid #828282;
	padding: 20px 20px 0 20px;
	float: left;
	position: absolute;
	display:inline-block;
	z-index:5;
	margin: 91px 0 0 30px;
}

#menu-suspenso ul {
	line-height: normal !important;
}

#menu-suspenso ul li {
	list-style: none;
	margin: 2px 0 2px 0;
	float: left;
	width: 150px;
	cursor: pointer;
}

#menu-suspenso ul li a{
	color: #828282 !important;
	font-size: 13px !important;
	margin: 0 !important;
	padding: 0!important;
	font-weight: normal!important;
	text-transform: capitalize !important;
	line-height: 13px !important;
}

#menu-suspenso ul li a:hover{
	background: none!important;
	color: #e7e7e7 !important;
}

#menu-suspenso .menu-block {
	float: left;
	width: 150px;
}

#menu-suspenso .menu-block .order-by {
	border-right: 1px #868686 solid;
	display: inline-block;
}

#menu-suspenso .titulo {
	color: #FFFFFF;
	font-size: 15px;
	font-weight: bold;
	text-transform:uppercase;
	display: inline-block;
	margin: 0 0 5px 0;
}

#menu-suspenso .menu-clientes {
	float: left;
	height: auto;
	width: 310px;
	margin: 0 0 0 20px;
	padding: 0 0 15px 0;
}*/

/****		Combobox		*****/

#topo #menu #trabalhos {float:left; margin-top:0;}
#topo #menu #trabalhos .ui-selectmenu{float:left; width:210px !important; height:25px; margin-left:35px; display:inline;  background:url(imgs/fundo-combobox.gif);}
.ui-selectmenu-menu{width:179px !important; z-index:3; top:300px !important; position: relative;}
.ui-selectmenu-menu li{background: #000; color:#fff;}
.ui-selectmenu-group-label{font-weight:normal;}
.ui-selectmenu-item-focus{background: #000 url(imgs/fundo-seta.gif) no-repeat right !important;}
.ui-selectmenu-item-focus a {color:#fff;}
.ui-selectmenu-status {padding: 5px 10px!important;}


/***
	@Thumbs
***/

#lista-thumbs{display:inline-block; margin-left:-15px; margin-top:30px;}

	.thumb{height:214px; width: 150px; margin:15px 0 0 15px; float:left; display:inline;}
	
		.thumb a{height:214px; width: 150px; display:block;color:#000; text-decoration:none; cursor:pointer;}
		.thumb a:hover{color:#999;}
		
		.thumb .mascara{background: url(imgs/mascara-thumbs.gif); display:inline-block; position:absolute; z-index:2; height:215px; width: 150px;}		
		
		.thumb img{margin-bottom:-3px; height:171px; display: inline-block; background: url(imgs/thumb-vazio.gif) no-repeat; width:150px; }
		
		.thumb .desc-thumb{height:36px; background:#fff; padding:5px; margin-top:0; text-align: left;}
		
		.thumb .desc-thumb strong{font-size:12px;}

		.thumb {
			height: 215px;
		}
	#lista-thumbs .navegacao{float:right; margin-top:10px; color:#FFF;}
	
		#lista-thumbs .navegacao a{text-transform:uppercase; text-decoration:none; font-size:14px; font-weight:bold;}
		
		#lista-thumbs .navegacao .anterior{
			border-right: solid #666 thin;
			padding-left:20px;
			padding-right:10px;
			margin-right:6px;
			background: url('imgs/seta-esq.gif') no-repeat left -4px;			
		}
		
		#lista-thumbs .navegacao .anterior-sem-borda {
			background: url('imgs/seta-esq.gif') no-repeat 4px -4px;
			padding: 0 0 0 20px;
		}
		
		#lista-thumbs .navegacao .anterior:hover{background: url('imgs/seta-esq-hover.gif') no-repeat left -4px;}
		
		#lista-thumbs .navegacao .proximo{
			padding-right:20px;
			background: url('imgs/seta-dir.gif') no-repeat right -4px;
		}
		
		#lista-thumbs .navegacao .proximo:hover{background: url('imgs/seta-dir-hover.gif') no-repeat right -4px;}




/***
	@Conteudo
***/
#conteudo{
	margin-top:75px;
	margin-bottom:40px;
	display:block;
}

#conteudo #title {width:100%; clear:both; display:inline-block;}
#conteudo #title h2 {float: left; width: 600px; display: inline-block;}
#conteudo #title a {float: right; background:url(imgs/seta-subir.gif) no-repeat;}
#conteudo #title a:hover {background:url(imgs/seta-subir-hover.gif) no-repeat;}

#conteudo-posts{
	margin-top:10px; 
	clear:both;
	overflow:hidden;
	width:975px;
	height:530px;
	display:inline-block;
	padding:0 !important;
}

.intro-projeto img {
	clear: both !important;
}

.intro-projeto {
	text-align: center;
}


#conteudo-posts .intro-projeto{background:#FFFFFF; color:#000000; display:inline-block; height:460px; padding:70px 30px 0; text-align:center; width:200px;}

#conteudo-posts .intro-projeto p{text-align:left;}

#conteudo-posts .intro-projeto h3{display:none; font-size:24px; margin:30px 0; text-transform:uppercase;}
#conteudo-posts .intro-projeto .ver-projeto{background:transparent url(imgs/seta-ver-projeto.gif) no-repeat scroll 0 -1px;  display:inline-block; font-weight:bold; margin:15px 0 15px -7px; padding-left:20px; text-decoration:none; text-transform:uppercase; float:left;}
#conteudo-posts .intro-projeto .ver-projeto:hover{color:#000;}

#conteudo-posts .video-holder{background:#fff; display:inline-block; padding:14px; height:502px;}

#conteudo-posts .video{background:#E6E7E9 none repeat scroll 0 0; color:#000000; display:inline-block; height:431px; padding:70px 30px 0; text-align:center;}

#conteudo-posts .video h3{float:left; font-size:24px; margin-bottom:10px; padding-left:7px; text-align:left; text-transform:uppercase;}


#conteudo-posts .info{
	background:#fff;
	text-align:center;
	color:#000;
	padding:10px;
}

#conteudo-posts .info a{color:#000;}

#conteudo-posts .info .holder{width:339px;}

#conteudo-posts .info .holder .atual{font-size:14px; text-transform:uppercase; padding-left:20px; color:#58595b; background:url(../imgs/seta-atual-branco.gif) no-repeat left -4px; display:inline-block;}

#conteudo-posts .info .holder .voltatopo{font-size:14px; font-weight:bold; text-transform:uppercase; padding-left:20px; color:#000; background:url(../imgs/seta-subir-branco.gif) no-repeat left -4px; display:inline-block; margin-top:30px; text-decoration:none;}

#conteudo-posts .info .holder .voltatopo:hover{background:url(../imgs/seta-subir-branco-hover.gif) no-repeat left -4px; color:#58595b;}

#conteudo-posts .info .thumb .mascara{background: url(../imgs/mascara-thumbs-branco.gif);}

#conteudo-posts .info .thumb a{text-decoration:none;}

#conteudo-posts .info .thumb a{color:#000; text-decoration:none;}
#conteudo-posts .info .thumb a:hover{color:#999;}

#conteudo-posts .thumb .desc-thumb{background:#e7e7e7;}

/*	Separador entre as paginas de conteudo	*/
#conteudo-posts .separador{width:15px; display:block;}
/* #conteudo-posts table{margin-left:-15px;} 

#conteudo-posts table tr td{padding-left:15px;} */

#conteudo .btn-trabalhos{float:right; margin-top:10px; margin-bottom:120px;}

#conteudo .intro-projeto p {
	margin: 15px 0 0 0;
	text-align: justify;
}


.alignleft {float:left;}

/**
***		Agência
***/

#conteudo .agencia{
	color:#000;	
}

#conteudo .agencia .td-conteudo{
	padding:15px;
	vertical-align:top;
}
#conteudo .agencia .td-conteudo p{	margin-bottom:10px;}

#conteudo .agencia .td-conteudo h1{	font-size:40px;}
#conteudo .agencia .td-conteudo h2{	font-size:20px;}
#conteudo .agencia .td-conteudo h3{	font-size:17px;}


/**
***		Contato
***/
.conteudo-contato{
	float:left;
	height:400px;
	padding-top:120px;
	width:520px;
	padding-left:31px;
	background-color: #FFFFFF;
	color: #000;
}

.endereco{
	font-size:16.4px;
	float:left;
	height:300px;
	padding: 220px 0 0 40px;
	width:380px;
	background-color: #FFFFFF;
	color: #000;
}

.endereco a:hover {
	color: #999999;
}


.endereco h3{
	font-size:25px;
	font-weight:bold;
}

#formulario-contato .campo{
	background:#FFFFFF none repeat scroll 0 0;
	border:1px solid #58595B;
	color:#000000;
	font-family:Arial,Helvetica,sans-serif;
	font-size:17px;
	font-weight:bold;
	margin-bottom:20px;
	padding-left:5px;
	width:500px;
}

#formulario-contato a:hover {
	color: #999999;
}

#formulario-contato textarea {
	height: 115px;
}

.conteudo-contato .enviar-contato{background:url(imgs/seta-dir-contato.gif) no-repeat left 2px; font-size:24px; font-weight:bold; text-transform:uppercase; text-decoration:none; padding-left:20px; line-height:28px; margin-left:-7px;}

.conteudo-contato .enviar-contato:hover{background:url(imgs/seta-dir-contato-hover.gif) no-repeat left 2px;}