/*  
Theme Name: Auto Vídeos
Theme URI: http://autovideos.com.br/
Description: Blog Auto Vídeos
Version: 1.2
Author: ANDALE!
Author URI: http://andale.art.br
*/



/* HTML5 IE */

article, aside, details, figcaption, figure, footer, header, main, menu, nav, section {display: block;}



/* HTML */

body {min-width: 1280px; margin: 0; font-size: 16px; line-height: 24px; background: url("images/fundo-cinza.jpg");}
body, input, select, textarea, button {font-family: Tahoma, Verdana, Arial, sans-serif; color: #4D4D4D;}

	/* LINKS */

	a img {border: 0;}
	a {color: #d62127; text-decoration: none;}
	a:hover {text-decoration: underline;}

	/* FORMULÁRIOS */

	form, fieldset, input, select, textarea, button {margin: 0; font-size: 16px;}
		fieldset {border: 0; padding: 0;}
			legend {display: none;}
			label {display: block; margin: 15px 0 5px 0;}
			input, select, textarea, button {border: 1px solid #b3b2b3; padding: 0 10px; background-color: #FFF; vertical-align: top; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box;}
			#posts input, #posts select, #posts textarea, #posts button {-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
			.wpcf7 input, .wpcf7 select, .wpcf7 textarea, .wpcf7 button {width: 95%; padding: 0 2%;}
			.wpcf7 textarea {height: 250px; padding: 2%;}
			.wpcf7 .wpcf7-captchar {width: 100px; margin-right: 20px;}
			input[type="checkbox"], input[type="radio"] {padding: 0; width: auto; height: auto;}
			input {height: 58px;}
			select, button, input[type="submit"] {height: 60px;}
			button, input[type="submit"], .botao {font-size: 20px; text-transform: uppercase; font-weight: bold; background-color: #d62127; color: #FFF; border: 0; cursor: pointer;}
			input.wpcf7-submit {width: auto; float: right;}
			.botao {display: inline-block; padding: 15px;}
			.resumo .botao {font-size: 16px; margin-bottom: 60px; text-transform: none; padding: 5px 15px;}
			.loja .resumo .botao {margin-bottom: 0; text-transform: uppercase; padding: 10px 25px; background-color: #f68b20;}

	/* TAGS ESSENCIAIS */

	blockquote {display: table; min-height: 42px; padding: 15px 0 15px 120px; margin: 15px 0; font-style: italic; background: url("images/blockquote.png") no-repeat 25px 50%;}

	/* IMAGENS */

	img, .alignnone, .aligncenter, .alignright, .alignleft, .wp-caption {border: 0;}

	.alignnone, .aligncenter, .alignright, .alignleft {display: block; margin: 0;}
	.alignnone, .alignright, .alignleft {text-align: left;}
	.aligncenter {text-align: center;}
	.aligncenter, .aligncenter img {margin: 0 auto;}
	.alignright, .alignleft {margin: 5px 0;}
	.alignright {padding-left: 20px; float: right;}
	.alignleft {padding-right: 20px; float: left;}
		.wp-caption.aligncenter .wp-caption-text {text-align: center;}
		.wp-caption.alignleft .wp-caption-text {padding-right: 10px;}
		.wp-caption.alignleft img {float: left;}
		.wp-caption.alignright .wp-caption-text {padding-left: 10px;}
		.wp-caption.alignright img {float: right;}
		.wp-caption img {display: block; clear: both;}
		.wp-caption-text {margin: 0; padding: 1px 0 5px 0; font-style: italic; font-size: 12px;}

	/* TÍTULOS */

	#topo h1 {margin: 0;}
	h1 {font-size: 30px; line-height: 38px;}
	#post h1:first-child {font-size: 40px; margin: 0; color: #231f20;}
	.secao {margin: -20px 0 50px 0 !important; color: #231f20;}
	h2 {font-size: 22px; line-height: 30px;}
	h3 {font-size: 18px;}
	#interativo h3, #relacionados h3, #comentarios h3 {font-size: 30px; color: #231f20; margin: 0 0 30px 0; text-align: center; text-transform: uppercase;}
	#lateral h3 {margin: 0 0 20px 0; padding: 15px 20px; color: #FFF; background: url("images/fundo-preto.jpg"); clear: both;}

	/* PADRÕES */

	#topo, #principal, .box, #rodape, #topo-banner {clear: both; position: relative;}
	#topo, #rodape, #topo-banner {width: 100%;}
	.box {width: 1326px; margin: 0 auto;}

	ul.reset {margin: 0; padding: 0; list-style: none;}

	.arredondado {-moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; overflow: hidden;}
	.arredondado-menor {-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; overflow: hidden;}

	.thumb, .thumb .arredondado, .thumb.arredondado {width: 422px; height: 234px; position: relative;}
	.resumo .thumb {margin: 0 30px 60px 0; float: left;}
	.loja .resumo .thumb {margin: 0 0 20px 0; float: none;}
		.resumo .play, .destaque .play {text-indent: -9999px; position: absolute; z-index: 5;}
		.resumo .play {width: 130px; height: 46px; background-image: url("images/play-video.png"); top: -20px; left: -10px;}
		.loja .resumo .categoria {font-size: 10px; font-weight: bold; color: #FFF; text-transform: uppercase; padding: 0 10px; position: absolute; top: -10px; left: 10px; z-index: 5;}
		.loja .resumo .produto-automotivo {background-color: #db3339;}
		.loja .resumo .produto-para-voce {background-color: #198acf;}
		.destaque .play {background-image: url("images/play.png"); top: 0; left: 0;}
		.destaque .thumb:hover .play {width: 70px; height: 70px; background-image: url("images/play-hover.png"); position: absolute; margin: -35px 0 0 -35px; top: 50%; left: 50%;}
		.destaque .play, .thumb img {width: 100%; height: 100%; display: block;}
		.destaque > a {display: block; margin-top: 20px; color: #4D4D4D;}


	/* TOPO */

	#topo {background: #FFF url("images/fundo-vermelho.jpg") repeat-x 0 0; z-index: 2;}
	.loja #topo {padding-top: 10px;}

		#topo .box {height: 115px;}
		.loja #topo .box {width: 100%; height: 115px; background: url("images/fundo-preto.jpg");}

			#logo, #menu {position: absolute;}
			#logo {width: 220px; height: 17px; text-indent: -9999px; background: url("images/logo.png") no-repeat; top: 50px; left: 0;}
			.loja #logo {width: 268px; height: 63px; background: url("images/logo-loja.png") no-repeat; top: 25px; left: -134px; margin-left: 50%;}

			#busca {position: absolute; top: 46px; right: 113px; z-index: 5;}
				#busca input, #busca button {border: 0; height: 28px; float: left;}
				#busca input {width: 540px;}
				#busca button {width: 80px; padding: 0; text-indent: -99999px; background: #d62127 url("images/busca.png") no-repeat 50% 50%;}

			#menu {width: 1076px; height: 54px; overflow: visible; font-size: 14px; font-weight: bold; background: url("images/fundo-preto.jpg"); top: 33px; right: 0; z-index: 2;}
				#menu ul {width: 100%;}
				#menu ul, #menu li {float: left;}
					#menu li {margin: 18px 10px 0 30px; padding-bottom: 22px; line-height: 16px; position: relative; float: left;}
					#menu li.facebook {margin: 18px 30px 0 0; float: right;}
						#menu .menu-item-has-children > a {padding-right: 18px; background: url("images/submenu.png") no-repeat 100% 50%;}
						#menu a {color: #FFF;}
						#menu .sub-menu {display: none; width: 120px; padding: 5px 15px; font-weight: normal; position: absolute; top: 35px; left: 0; background: url("images/fundo-vermelho.jpg"); -moz-border-radius: 0 0 6px 6px; -webkit-border-radius: 0 0 6px 6px; border-radius: 0 0 6px 6px;}
						#menu li:hover .sub-menu {display: block;}
							#menu .sub-menu li {display: block; padding: 5px 0; margin: 0; float: none;}
								#menu .sub-menu a {padding: 0; background: none;}

	#topo-banner {padding: 15px 0; background: #eaeaea; z-index: 1;}
		#topo-banner .banner {margin: 0 auto; text-align: center;}
		#topo-banner div {margin: 0 auto;}
		#topo-banner .desktop {/*width: 728px;*/}
		#topo-banner .mobile {display: none;}
			#topo-banner img {display: block;}



	/* CONTEÚDO */

	#principal {height: auto; overflow: hidden; background-color: #FFF; padding: 50px 20px 20px 20px; z-index: 1;}
	.loja #principal {width: 1366px; padding: 30px 0;}



		/* POSTS */

		#posts {width: 874px; float: left;}
		#produtos {text-align: center;}

			.resumo, .post, #post, .conteudo, #post .centro, #interativo, #relacionados, .banner-post {width: 100%; float: left; clear: both;}
			.loja .resumo {width: 422px; margin: 0 10px 40px 10px; padding-bottom: 50px; text-align: left; float: none; display: inline-block; vertical-align: top; background: url("images/loja-setas-1.png") no-repeat 0 100%;}
				.resumo h2 {margin: 0;}
					.resumo h2 a {color: #4d4d4d;}
				.resumo p {margin: 30px 0;}

			#post {margin-top: -20px;}

				.compartilhe-facebook, .compartilhe-whatsapp {display: block; margin: 0 auto; height: 44px; text-indent: -9999px;}
				.compartilhe-facebook {width: 270px; height: 44px; background-image: url("images/compartilhar-facebook.png");}
				.compartilhe-whatsapp {display: none;}

				.conteudo {margin-top: 30px; text-align: justify;}
					.conteudo ul, .conteudo ol {margin: 15px 0 15px 15px; padding: 0; list-style-position: inside;}
					.conteudo ul {list-style-type: disc;}
					.conteudo ol {list-style-type: decimal;}
					.conteudo img, .conteudo embed, .conteudo object, .conteudo iframe, .conteudo div {max-width: 100%;}
					.conteudo p embed, .conteudo p object, .conteudo p iframe {width: 100%; min-height: 500px; margin: 30px auto; display: block; clear: both;}

				.anuncio-retangulo {margin: 15px 30px 30px 0; float: left; clear: both;}
				#anuncios-rodape {/*margin: 60px 0;*/ width: 100%; float: left; clear: both;}
					.anuncio-retangulo-esquerda, .anuncio-retangulo-direita {margin: 60px 0; width: 300px; height: 250px;}
					.anuncio-retangulo-esquerda {float: left;}
					.anuncio-retangulo-direita {float: right;}
				.anuncio-superbanner, .anuncio-fullbanner, .anuncio-halfbanner {margin-top: 30px; float: left; clear: both;}
				.anuncio-superbanner {width: 728px; height: 90px; margin-left: 73px;}
				.anuncio-fullbanner, .anuncio-halfbanner {display: none;}

			#post .centro {text-align: center;}

			#interativo, #relacionados {margin: 30px 0;}
			#interativo {padding: 30px 0; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC;}
				.banner-facebook {float: left;}
				#interativo .newsletter {width: 422px; float: right;}
					#interativo .newsletter span {display: block; padding: 19px 20px 25px 20px; margin-bottom: 7px; background-color: #b3b3b3;}
						#interativo .newsletter img {max-width: 100%; display: block; margin: 0 auto;}
					#interativo .newsletter fieldset {padding: 25px 35px; background: url("images/fundo-preto.jpg");}
						#interativo input, #interativo button {height: 50px; border: 0; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; float: left;}
						#interativo input {width: 163px;}
						#interativo button {width: 169px; padding: 0; font-size: 16px; background: url("images/fundo-botao.png") repeat-x 0 50%;}
				#relacionados .resumo {width: 422px; margin: 30px 30px 30px 0; clear: none;}
				#relacionados .resumo:last-child {margin-right: 0;}
					#relacionados .resumo .thumb {margin: 0 0 15px 0; float: none;}
					#relacionados .resumo a {color: #4D4D4D;}

			.banner-post {display: none;}

				#banner-video {width: 100%; text-align: center; float: left; clear: both;}
					#banner-video div {margin: 0 auto;}
					#banner-video .banner {margin: 30px auto;}
					#banner-video .mobile {display: none;}

			.wp-pagenavi {width: 100%; text-align: center; float: left; clear: both;}
				.wp-pagenavi span, .wp-pagenavi a {color: #808080; padding: 3px 10px; margin: 10px; display: inline-block; border: 1px solid #d9d9d9;}
				.wp-pagenavi a:hover, .wp-pagenavi .current {color: #FFF; background-color: #d62127; border-color: #d62127;}



		/* LATERAL */

		#lateral, .widget, .destaque {width: 422px; float: right;}
		#lateral {margin-top: -20px;}
			.widget, .destaque {margin-bottom: 60px; clear: both;}
			.widget.retangulo {width: 300px; margin-right: 61px;}

				#lateral .newsletter p {margin: 0 0 3px 0; padding: 15px 15px 15px 65px; font-size: 22px; line-height: 30px; font-weight: bold; color: #FFF; background: #b3b3b3 url("images/fundo-newsletter.png") no-repeat 0 50%;}
				#lateral .newsletter input, #lateral .newsletter button {height: 40px; border: 0; float: left;}
				#lateral .newsletter input {width: 300px; color: #FFF; background: url("images/fundo-preto.jpg");}
				#lateral .newsletter button {width: 82px; text-indent: -9999px; background: #d62127 url("images/email.png") no-repeat 50% 50%;}



	/* RODAPÉ */

	#rodape {color: #FFF; background: url("images/fundo-preto.jpg");}

		#rodape .box {height: 20px; padding: 15px 0;}
			#copyright {float: left;}
			#ANDALE {width: 41px; height: 24px; text-indent: -9999px; background: url("images/andale.png"); float: right;}

	#rodape-banner {display: none;}



/* RESPONSIVO */

/* 1024 */

@media screen and (max-width: 1380px) {

/* HTML */

body {min-width: 1024px; font-size: 14px; line-height: 22px;}

	/* FORMULÁRIOS */

			.resumo .botao {font-size: 12px; padding: 2px 5px;}
			.loja .resumo .botao {font-size: 16px;}

	/* TÍTULOS */

	.resumo h2 {font-size: 16px; line-height: 26px;}
	#lateral h3 {font-size: 16px;}

	/* PADRÕES */

	.box {width: 960px;}

	.thumb, .thumb .arredondado, .thumb.arredondado {width: 300px; height: 166px;}
		.destaque .play {background-position: -61px -34px;}
		.destaque .thumb:hover .play {background-position: 0 0;}

	/* TOPO */

				#busca input {width: 170px;}

			#menu {width: 710px;}

	/* CONTEÚDO */

	.loja #principal {width: 1000px;}

		/* POSTS */

		#posts {width: 630px;}
			.loja .resumo {width: 300px; background-image: url("images/loja-setas-2.png");}
				.resumo p {margin: 15px 0;}

					.conteudo p embed, .conteudo p object, .conteudo p iframe {min-height: 400px;}

				.anuncio-superbanner {display: none;}
				.anuncio-fullbanner {display: block; width: 468px; height: 60px; margin-left: 81px;}

						.banner-facebook img, #interativo .newsletter {width: 300px;}
						#interativo .newsletter span {padding: 12px 20px 17px 20px;}
						#interativo .newsletter fieldset {padding: 20px 25px;}
							#interativo input, #interativo button {height: 35px;}
							#interativo input {width: 111px;}
							#interativo button {width: 119px; padding: 0; font-size: 12px;}
					#relacionados .resumo {width: 300px;}

				.wp-pagenavi span, .wp-pagenavi a {padding: 1px 8px; margin: 5px;}

		/* LATERAL */

		#lateral, .widget, .destaque {width: 300px;}
			.widget.retangulo {margin-right: 0;}

				#lateral .newsletter input {width: 178px;}
	
}

/* 480 */

@media screen and (max-width: 1010px) {

/* HTML */

body {min-width: 440px; font-size: 16px; line-height: 24px;}

	/* FORMULÁRIOS */

			.resumo .botao {font-size: 16px; padding: 5px 15px; float: right; clear: both;}

	/* TÍTULOS */

	.resumo h2 {font-size: 22px; line-height: 30px;}
	#lateral h3 {font-size: 18px;}

	/* PADRÕES */

	.box {width: 422px;}

	.thumb, .thumb .arredondado, .thumb.arredondado {width: 422px; height: 234px;}
	.resumo .thumb {margin: 0 0 20px 0; float: none;}
		.destaque .play {background-position: 0 0;}

	/* TOPO */

		#topo .box {height: 180px;}

			#logo {margin-left: -110px; top: 38px; left: 50%;}

			#busca {top: 75px; right: 0;}
				#busca input {width: 321px; height: 26px; border: 1px solid #bbbdbf; border-right: 0;}

			#menu {width: 422px; top: 124px;}
				#menu ul {position: relative;}
					#menu li {position: static;}
						#menu .sub-menu {width: 302px; padding: 15px 30px; top: 50px; left: 30px;}
							#menu .sub-menu li {padding: 15px 0;}

	#topo-banner {background: #FFF;}
		#topo-banner .desktop {display: none;}
		#topo-banner .mobile {display: block; /*width: 300px;*/}

	/* CONTEÚDO */

	#principal {padding: 20px 10px;}
	.loja #principal {width: 440px;}

		/* POSTS */

		#posts {width: 422px; margin-bottom: 60px;}
			.loja .resumo {width: 420px; background-image: url("images/loja-setas-3.png");}

				.anuncio-retangulo, .anuncio-retangulo-esquerda, .anuncio-retangulo-direita {margin: 0 61px 30px 61px;}
					.anuncio-retangulo-esquerda, .anuncio-retangulo-direita {clear: both;}
					.anuncio-retangulo-direita {margin-bottom: 0;}
				.anuncio-fullbanner {display: none;}
				.anuncio-halfbanner {display: block; width: 234px; height: 60px; margin-left: 94px;}

				#compartilhe .compartilhe-facebook, .compartilhe-whatsapp {width: 359px;}
				#compartilhe .compartilhe-facebook {margin-bottom: 30px; background-image: url("images/compartilhar-facebook-mobile.png");}
				.compartilhe-whatsapp {display: block; background-image: url("images/compartilhar-whatsapp.png");}

				.banner-facebook, #interativo .newsletter {float: none;}
				.banner-facebook img {display: block; width: 422px; margin-bottom: 30px;}
				#interativo .newsletter {width: 422px;}
					#interativo .newsletter span {padding: 19px 20px 25px 20px;}
					#interativo .newsletter fieldset {padding: 25px 35px;}
						#interativo input, #interativo button {height: 50px;}
						#interativo input {width: 163px;}
						#interativo button {width: 169px; font-size: 16px;}
				#relacionados .resumo {width: 422px; margin: 30px 0;}

			.banner-post {display: block; margin-bottom: 80px;}
				.banner-post .banner {width: 300px; margin: 0 auto;}
					.banner-post img {display: block;}

					#banner-video .desktop {display: none;}
					#banner-video .mobile {display: block;}

				.wp-pagenavi span, .wp-pagenavi a {display: none; padding: 3px 10px; margin: 10px;}
				.wp-pagenavi .previouspostslink, .wp-pagenavi .nextpostslink {display: block;}
				.wp-pagenavi .previouspostslink {float: left;}
				.wp-pagenavi .nextpostslink {float: right;}

		/* LATERAL */

#lateral {display:none;}

		#lateral, .widget, .destaque {width: 422px;}
		#lateral {margin-top: 0;}
			.widget.retangulo {width: 300px; margin-right: 61px;}

				#lateral .newsletter input {width: 300px; color: #FFF; background: url("images/fundo-preto.jpg");}

	/* RODAPÉ */

		#rodape .box {height: auto;}
			#copyright {display: block; margin-bottom: 15px; text-align: center; float: none;}
			#ANDALE {display: block; margin: 0 auto; float: none;}

	#rodape-banner {display: block; width: 100%; background: url("images/banner-rodape-fundo.png"); position: fixed; z-index: 99999; bottom: 0; left: 0;}
		#rodape-banner .fechar {width: 14px; height: 14px; text-indent: -9999px; background: url("images/banner-rodape-fechar.png"); position: absolute; top: -14px; right: 0; cursor: pointer;}
		#rodape-banner .banner {width: 100%; position: relative;}
			#rodape-banner .textwidget {width: 300px; margin: 0 auto;}
				#rodape-banner img {display: block;}
	
}



/* 320 */

@media screen and (max-width: 440px) {

/* HTML */

body {min-width: 300px;}

	/* PADRÕES */

	.box {width: 300px;}

	.thumb, .thumb .arredondado, .thumb.arredondado {width: 300px; height: 166px;}
		.destaque .play {background-position: -61px -34px;}

	/* TOPO */

				#busca input {width: 199px;}

			#menu {width: 300px;}
					#menu li {margin-right: 0;}
					#menu li.facebook {display: none;}
						#menu .sub-menu {width: 180px;}

	/* CONTEÚDO */

	.loja #principal {width: 320px;}

		/* POSTS */

		#posts {width: 300px;}
			.loja .resumo {width: 300px; background-image: url("images/loja-setas-4.png");}

				.banner-facebook img {width: 300px;}
				#interativo .newsletter {width: 300px;}
						#interativo input {width: 130px;}
						#interativo button {width: 80px; font-size: 12px;}
				#relacionados .resumo {width: 300px;}

				.anuncio-retangulo, .anuncio-retangulo-esquerda, .anuncio-retangulo-direita {margin: 0 0 30px 0;}
				.anuncio-halfbanner {margin-left: 33px;}

				#compartilhe .compartilhe-facebook, .compartilhe-whatsapp {width: 270px;}
				#compartilhe .compartilhe-facebook {background-image: url("images/compartilhar-facebook.png");}
				.compartilhe-whatsapp {display: block; background-image: url("images/compartilhar-whatsapp-mobile.png");}

				#jp-relatedposts {display: none;}

		/* LATERAL */

		#lateral, .widget, .destaque {width: 300px;}
			.widget.retangulo {margin-right: 0;}

				#lateral .newsletter input {width: 178px;}

	/* RODAPÉ */

		#rodape .box {height: auto;}
			#copyright {display: block; margin-bottom: 15px; text-align: center; float: none;}
			#ANDALE {display: block; margin: 0 auto; float: none;}
	
}

/* RELACIONADOS */
.relacionados {
	width: 100%;
	margin: 30px 0;
	float: left;
	clear: both;
}
.relacionados .thumb {
	width: 100%;
	height: auto;
	display: block;
}
.relacionados .relacionado {
	color: #4d4d4d;
}

@media (min-width: 1011px) {
	.relacionados {
		width: 100%;
		margin: 30px 0;
		float: left;
		clear: both;
	}
	.relacionados .cols {
		width: calc(100% + 30px);
		margin: 0 0 0 -30px;
	}
	.relacionados .col {
		width: calc(33.3% - 30px);
		margin: 0 0 0 30px;
		float: left;
	}
}
@media (max-width: 1010px) {
	.relacionados {
		width: 100%;
		margin: 30px 0 0 0;
		clear: both;
	}
	.relacionados .cols {
		width: 100%;
	}
	.relacionados .col {
		width: 100%;
		margin: 30px 0 0 0;
	}
}