﻿/* CSS Document - Pé na Rua

@author : Sérgio Hampel
@email: rhampel22@gmail.com
@company: Quarta Dimensão | Design & Tecnologia.
@date: 06/01/2011

*/

@import url(superfish.css);
@import url(internal.css);
@import url(blog.css);

* {margin:0; padding:0}
a {cursor:pointer; outline:none; text-decoration:none}
li {list-style:none}
em {font-style:normal; font-weight:700; padding-right:5px}

body {background:url(../images/general/bgBody.png) repeat-y center top; color:#434343; font:12px/1.6em Verdana, Geneva, sans-serif}

/* ----- Class / Important ----- */
.noBorder {border:none!important}
.bgLeft {background:url(../images/general/bgLeft.png) no-repeat 0 0; height:230px; left:0px; position:absolute; top:0; width:12px}
.borda {border-right:1px solid #bfcecf; padding-right:10px}
.videoGalera {background:url(../images/icons/iconVideoGalera.png) no-repeat 0 0; height:37px; width:42px}

/* ----- Formulários ----- */
fieldset {border:none}
fieldset legend {float:left; margin-top:-20px; text-indent:-9000px}

/* ----- Sombra ----- */
#shadow {background:url(../images/general/bgShadow.png) repeat-x 0 0; width:100%}
#artTop {background:url(../images/general/arteTopo.png) no-repeat center top; width:100%}

/* ----- Container ----- */
#container {background:url(../images/general/bgTopo.png) no-repeat center top; min-height:500px; height:auto!important; height:500px; margin:0 auto; padding-top:143px; position:relative; width:969px}

/* ----- Menu ----- */
#menu {height:34px; margin:0 0 0 51px}
#menu a {background:url(../images/general/bgMenu.gif) no-repeat 0 0; border:none; height:34px; padding:0; text-indent:-9000px}
#menu ul {top:34px; width:130px}
#menu ul li a {background:url(../images/general/bgSubMenu.gif) repeat 0 0; border-bottom:1px solid #088794; color:#fff; display:block; line-height:2.7em; padding:0 20px; text-indent:0; width:100%!important}
#menu ul li a:hover {background:#088794}
#menu > li {margin-left:8px}
#menu a.sf-with-ul {padding-right:1em}
#menu a > .sf-sub-indicator {right:.2em; top:1.4em}

	#menu li.penarua a {background-position:0 0; width:84px}
	#menu li.videos a {background-position:-92px 0; width:66px}
	#menu li.blog a {background-position:-166px 0; width:50px}
	#menu li.fotos a {background-position:-225px 0; width:56px}
	#menu li.envioVideo a {background-position:-289px 0; width:124px}
	#menu li.podcast a {background-position:-421px 0; width:73px}
	#menu li.mapa a {background-position:-502px 0; width:74px}
    #menu li.contato a {background-position:-502px 0; width:74px}
	
	#menu li.penarua a:hover, #menu li.penarua a.menuAtivo {background-position:0 -35px}
	#menu li.videos a:hover, #menu li.videos a.menuAtivo {background-position:-92px -35px}
	#menu li.blog a:hover, #menu li.blog a.menuAtivo {background-position:-166px -35px}
	#menu li.fotos a:hover, #menu li.fotos a.menuAtivo {background-position:-225px -35px}
	#menu li.envioVideo a:hover, #menu li.envioVideo a.menuAtivo {background-position:-289px -35px}
	#menu li.podcast a:hover, #menu li.podcast a.menuAtivo {background-position:-421px -35px}
	#menu li.mapa a:hover, #menu li.mapa a.menuAtivo {background-position:-502px -35px}
    #menu li.contato a:hover, #menu li.contato a.menuAtivo {background-position:-502px -35px}

/* ----- Formulário de Pesquisa ----- */
#search {background:url(../images/forms/bgSearch.png) no-repeat 0 0; float:left; height:26px; margin-left:22px; padding:4px 5px; width:250px}
#search input {border:1px solid #bac2c3; float:left}
#search input.cpText {border-right:none; height:24px; padding:0 5px; width:140px}
#search input.btSearch {background:url(../images/forms/btSearch.png) no-repeat 0 0; cursor:pointer; height:26px; width:95px}


/* ----- Content ----- */
#content {background:url(../images/general/bgContent.png) repeat-y center top; float:left; min-height:440px; height:auto!important; height:440px; margin:26px 0 0 0; width:969px}

	/* ----- Títulos dos Vídeos / Datas dos Vídeos ----- */
	h3, .data {color:#fff; float:left; height:18px; margin-bottom:10px; padding:0 10px}
	h3 {background-color:#0b585d; font-size:12px; line-height:1.3em}
	.data {background-color:#679507; font-size:11px; line-height:1.5em}

	/* ----- Vídeo ----- */
	#video {float:left; margin:0 37px 0 60px; width:560px}
	#video p {color:#434343; float:left; font-weight:700; padding-left:10px; width:371px}
	#video .videoGalera {background-position:-3px -3px; float:right; height:31px; margin:10px 0 0 5px; width:36px}
	#video .exibicoes {float:right; padding-top:5px}
	#video .envioVideo {color:#679507; display:block; float:right; font-size:11px; text-align:right; text-decoration:underline; width:137px}
	#video .envioVideo:hover {font-weight:700}
	
		/* ----- Link Social ----- */
		.linkSocial {padding-top:10px}
		.linkSocial, .linkSocial li, .linkSocial li a, .linkSocial li span {float:left}
		.linkSocial li, .linkSocial li a {color:#7b7b7b; font-weight:700; line-height:2.3em}
		.linkSocial li {height:31px}
		.linkSocial li span {padding-left:5px}
		.linkSocial li a {height:29px}
		.linkSocial li a img {border:none}
		.linkSocial li.gostar, .linkSocial li a {border:1px solid #d6d6d6}
		.linkSocial li.gostar {background:url(../images/general/bgGostei.png) no-repeat 0 0; height:29px; width:113px}
		.linkSocial li.gostar a {border:none; height:22px; margin-top:4px; width:22px}
		.linkSocial li.gostar a.gostei {margin:4px 7px 0 10px}
		.linkSocial li.comentarios {margin:0 7px}
		.linkSocial li.comentarios a, .linkSocial li.compartilhar a {padding-right:5px; text-align:right; width:119px}
		.linkSocial li.comentarios a:hover, .linkSocial li.compartilhar a:hover {border-color:#aaa}
		.linkSocial li.comentarios a {background:url(../images/general/bgComentarios.png) no-repeat 0 0}
		.linkSocial li.compartilhar a {background:url(../images/general/bgCompartilhar.png) no-repeat 0 0}
		
	/* ----- Blog do Pé na Rua ----- */
	.blogIndex {float:left; text-align:right; width:260px}
	.blogIndex h3 {margin-bottom:0; width:240px}
	.blogIndex ul, .blogIndex ul li {background-color:#e8eded; float:left; width:100%}
	.blogIndex ul li {border-bottom:1px dashed #383838}
	.blogIndex ul li.cor2 {background-color:#e0e5e5}
	.blogIndex ul li span {font-weight:700}
	.blogIndex ul li span, .blogIndex ul li p, .blogIndex ul li a {padding:0 20px; width:220px}
	.blogIndex ul li span, .blogIndex ul li p {float:right; font-size:11px; padding-bottom:5px}
	.blogIndex ul li a {color:#679507; display:block; height:40px; font-weight:700; line-height:3.4em}
	.blogIndex ul li a:hover {background-color:#d0d6d6}
	
	/* ----- Patrocínio ----- */
	.patrocinio {float:left; margin-top:10px; width:260px}
	.patrocinio h3 {background-color:#679507; margin-bottom:0; text-align:right; width:240px}
	
	/* ----- Mais Vídeos / Mais Acessados / Twitter ----- */
	.bgListrado {background:url(../images/general/bgListrado.gif) repeat 0 0; float:left; margin:40px 0 0 12px; padding:35px 0 35px 48px; width:897px}
	.bgListrado h2 {background-position:0 0; background-repeat:no-repeat; float:left; height:37px; text-indent:-9000px}
	
		.titMaisVideos {background:url(../images/general/titMaisVideos.png); width:83px}
		.titMaisAcessados {background:url(../images/general/titMaisAcessados.png); width:134px}
	
		.maisVideos {float:left; margin-right:20px; width:270px}
		.maisVideos ul li {padding-top:30px; position:relative}
		.maisVideos ul, .maisVideos ul li {float:left; width:270px}
		.maisVideos ul li h3 a {color:#fff; text-decoration:none}
		.maisVideos ul li a {float:left}
		.maisVideos ul li a img {border:none}
		.maisVideos ul li .thumbVideo {background-color:#fff; border:1px solid #c1c1c1; float:left; height:72px; margin-right:10px; padding:4px; width:128px}
		.maisVideos ul li .thumbVideo:hover {background-color:#679507; border-color:#fff}
		.maisVideos ul li .textVideo {color:#434343; height:60px; width:110px}
		.maisVideos ul li .textVideo:hover {text-decoration:underline}
		.maisVideos ul li .exibicoes {background:url(../images/general/bgExibicoes.png) repeat-x 0 0; float:left; font-size:10px; margin-top:3px; padding:0 5px}
		.maisVideos ul li .videoGalera {left:-10px; position:absolute; top:115px}

		/* ----- Twitter ----- */
		.titTwitter {background:#0d9aa3 url(../images/icons/titTwitter.gif) no-repeat 167px 3px; float:right; margin:0 40px 0 0; text-align:right; width:240px}
		.titTwitter a {color:#fff}
		#twitter {background:url(../images/general/bgTwitter.png) repeat 0 0; float:right; margin-right:40px; width:260px}
		#twitter ul li {background:url(../images/general/separador.gif) no-repeat center bottom; border-bottom:1px dashed #383838; float:left; font-size:10px; line-height:1.68em; padding:10px; width:240px}
		#twitter ul li.odd {background:url(../images/general/bgTwitter.png) repeat 0 0}
		#twitter ul li img {display:block; float:left; margin-right:5px}
		#twitter ul li a {color:#679507; font-weight:700}
		#twitter ul li a:hover {text-decoration:underline}
	
/* ----- Footer ----- */
#footer {background:url(../images/general/bgFooter.png) no-repeat center top; float:left; height:334px; margin-left:-2px; width:100%}
#footerInt {border-right:1px solid #063a3d; display:table; margin:135px auto 0; width:880px}
#footerInt address {background:url(../images/general/bgAddress.png) repeat 0 0; clear:right; float:right; font-size:10px; font-style:normal; margin:5px 0; padding:0 10px; text-align:right; width:230px}
#footerInt address span {float:right; font-weight:700; padding-right:5px}


