/*PADRÃO*/
article { width: 100%; height: auto; position: relative; clear: both; overflow: hidden; padding: 0px 0px 0px 0px; margin: 0 auto; }

/* MATERIA */
.aviso1 { width: auto; max-width:100%; height: auto; padding: 20px; text-align: center;color: #ffffff; background-color: #fc0000; font-family: 'Nunito'; font-weight: 400; font-size: 18px;-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; margin-bottom: 25px; }
.aviso2 { width: auto; max-width:100%; height: auto; padding: 20px; text-align: center;color: #ffffff; background-color: #228200; font-family: 'Nunito'; font-weight: 400; font-size: 18px;-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; margin-bottom: 25px; }

article .post { width: 900px; height: auto; position: relative; z-index: 10; margin: 0 auto; position: relative; }
article .post .infos { height: auto; padding: 30px 0px 25px 0px; width:100%; }
article .post .infos .avatar { margin: 15px 0px; position: relative; width: 100%; height: auto; position: relative; overflow: hidden; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; }
article .post .infos .avatar img { width: 100%; height: auto; -webkit-transform: scale(1.0); -moz-transform: scale(1.0); -ms-transform: scale(1.0); -o-transform: scale(1.0); transform: scale(1.0); }
article .post .infos .avatar:hover img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); }
article .post .infos h1 { font-size: 36px; color: #373435; font-weight: 400; font-family: 'Nunito'; text-align: left; height: auto; line-height: 40px; padding-bottom: 20px; }
article .post .infos h2 { font-size: 13px; color: rgba(0,0,0,0.4); font-weight: 600; font-family: 'Nunito'; text-align: right; height: auto; line-height: auto; padding: 0px 0px 15px 0px; }
article .post .infos h3 { font-size: 16px; color: #373435; font-weight: 400; font-family: 'Nunito'; text-align: left; height: auto; line-height: 26px; padding: 20px 0px 20px 0px; }
article .post .infos h3 a:hover,
article .post .infos h3 p a:hover { text-decoration: underline; }
article .post .tags { position: relative; width: 100%; height: auto; padding: 20px 0px 30px 0px; }
article .post .tags .chama { float: left; width: auto; padding: 0px 5px 0px 0px; font-size: 14px; color: #373435; font-weight: 800; font-family: 'Nunito'; height: auto; }
article .post .tags .itens { float: left; width: auto; padding: 0px 5px 0px 0px; font-size: 14px; color: #373435; font-weight: 400; font-family: 'Nunito'; height: auto; }
article .post .tags .itens:hover { text-decoration: underline; }

.brelaciona { width: 100%; height: auto; position: relative; clear: both; text-align: center; padding: 30px 0px 50px 0px; }
.brelaciona .titulo { padding: 0px 0px 8px 0px; width: 100%; font-size: 36px; color: #373435; font-weight: 800; font-family: 'Nunito'; text-align: left; text-align: center; }
.brelaciona .relacionados { width: 100%; height: auto; position: relative; clear: both; }
.brelaciona .relacionados ul { width: 900px; margin: 0px auto; height: auto; padding: 10px 0px; list-style-type: none; position: relative; overflow: hidden; text-align: center; }
.brelaciona .relacionados ul li { width: 260px; margin: 12px; display: inline-block; vertical-align: top; position: relative; height: 260px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
.brelaciona .relacionados ul li .avatar { margin: 0px 0px 10px 0px; background-color: #000000; position: relative; width: 260px; height: 260px;  -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; position: relative; overflow: hidden; }
.brelaciona .relacionados ul li .avatar img { opacity: 0.7; -webkit-transform: scale(1.0); -moz-transform: scale(1.0); -ms-transform: scale(1.0); -o-transform: scale(1.0); transform: scale(1.0); }
.brelaciona .relacionados ul li .nome-servico { bottom: 15px; width: 220px; font-size: 16px; z-index: 100; font-weight: 700; padding: 20px 20px 10px 20px; position: absolute; font-family: 'Nunito'; color: #ffffff; text-align: left; line-height: 22px; height: auto; }
.brelaciona .relacionados ul li:hover img { opacity: 0.5; }
.brelaciona .relacionados #p2 { background-image:url(../imagens/seta-vermelha-esquerda.png);background-repeat: no-repeat; background-position: center; background-color: #ffffff; top:50%; margin-top: -40px;-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; position:absolute; margin-left: -450px; left:50%; } 
.brelaciona .relacionados #n2 { background-image:url(../imagens/seta-vermelha-direita.png);background-repeat: no-repeat; background-position: center; background-color: #ffffff; top:50%; margin-top: -40px;-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; position:absolute; margin-right: -450px; right: 50%; }
.brelaciona .relacionados #p2:hover { box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px; } 
.brelaciona .relacionados #n2:hover { box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px; }
.brelaciona .relacionados #pager2 { width: 100%; height: auto; position: relative; text-align: center; }

@media screen and (max-width: 1150px) {
	article { text-align: center; }
	article .post { width: 80%; padding: 50px 5% 0px 5%; margin: -110px 5% 0px 5%; }
	article .post .infos h1, article .post .infos h2, article .post .infos h3 { text-align: center; }
	article .post .tags { text-align: center; }
	article .post .tags .chama, article .post .tags .itens { float: none; display: inline-block; }

	article .comente { width: 94%; padding: 30px 0px; margin: 20px 3%; border-top: #a9a9a9 1px solid; border-bottom: #a9a9a9 1px solid; }

	article .volta { width: auto; display: inline-block; position: relative; left: inherit; text-align: center; margin: 10px auto; }

	.brelaciona { width: 100%; height: auto; position: relative; clear: both; text-align: center; padding: 30px 0px 50px 0px; }
	.brelaciona .relacionados ul { width: 100%; overflow: hidden; text-align: center;height: 580px; }
	.brelaciona .relacionados ul li { float: none; display: inline-block; }
}