/* MATERIA */
.materiais { width: 100%; height: auto; position: relative; clear: both; overflow: hidden; }
.materiais ul { width: 100%; height: auto; padding: 20px 0px 30px 0px; position: relative; clear: both; overflow: hidden; text-align: center; }
.materiais ul li { width:300px; height: 550px; margin: 10px 10px 30px 10px; display: inline-block; vertical-align: top; overflow: hidden;-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; }
.materiais ul li:hover { background-color: #f4f6f8; }
.materiais ul li:hover .avatar 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); }
.materiais ul li .categoria { width: auto; margin: 10px; font-weight: 600; color: #ffffff; font-size: 10px; font-family: var(--fonte-padrao); text-align: center; height: auto; padding: 6px 12px; line-height: 10px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; background-color: var(--cor-primaria); position: absolute; z-index: 10; text-transform: uppercase; letter-spacing: 1px; }
.materiais ul li .avatar { width: 300px; height: 250px; position: relative; overflow: hidden; vertical-align: top; display: inline-block; -moz-transition: all .5s ease; -o-transition: all .5s ease; -webkit-transition: all .5s ease; transition: all .5s ease; overflow: hidden;-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; background-color: #f4f6f8; }
.materiais ul li .avatar img { width: 300px; height: 250px; -moz-transition: all .5s ease; -o-transition: all .5s ease; -webkit-transition: all .5s ease; transition: all .5s ease; overflow: hidden;-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-transform: scale(1.0); -moz-transform: scale(1.0); -ms-transform: scale(1.0); -o-transform: scale(1.0); transform: scale(1.0); }
.materiais ul li .infos { width: 100%; height: auto; margin: 0px; padding: 0px; }
.materiais ul li .infos .tituloo { width: 280px; padding: 15px 10px 15px 10px; height: auto; font-weight: 500; color: var(--cor-secundaria); font-size: 16px; font-family: var(--fonte-padrao); text-align: center; }
.materiais ul li .infos .introducao { width: 280px; padding: 15px 10px 10px 10px; height: auto; font-weight: 300; color: var(--cor-terceira); font-size: 13px; font-family: var(--fonte-padrao); text-align: center; border-top: #f9f9f9 1px solid; }
.materiais ul li .infos .cta { width: auto; display: inline-block; margin: 10px 0px; font-weight: 600; color: #ffffff; font-size: 14px; font-family: var(--fonte-padrao); text-align: center; height: auto; padding: 10px 20px 10px 25px; letter-spacing: 2px; line-height: 14px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; background-color: var(--cor-primaria); }

.materiais .curtas { position: relative; height: 20px; padding: 0px; }
.materiais .curtas .fb_iframe_widget { display: block !important; float: left !important; }
.materiais .curtas .IN-widget { float: right; }

.categorias_filtros { width: 100%; height:auto; position: absolute; margin: 5px 0px 0px 0px; }
.categorias_filtros ul { width: 100%; height: auto; position: relative; list-style-type: none; text-align: center; }
.categorias_filtros ul li { position: relative; display: inline-block; vertical-align: top; width: auto; margin: 0px 6px; font-weight: 600; color: var(--cor-secundaria); font-size: 12px; font-family: var(--fonte-padrao); text-align: center; height: auto; padding: 8px 15px; line-height: 14px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; background-color: #eaeaea; border: 2px solid #ffffff; text-transform: uppercase; letter-spacing: 1px;-moz-transition: all .3s ease; -o-transition: all .3s ease; -webkit-transition: all .3s ease; transition: all .3s ease; }
.categorias_filtros ul li.ativo,.categorias_filtros ul li:hover { color: #ffffff; background-color: var(--cor-secundaria); border: 2px solid #ffffff; }

@media screen and (max-width: 1024px) {
	.materiais { width: 94%; padding: 0px 3%; }
	.materiais ul { text-align: center; }
	.materiais ul li { height: auto; display: inline-block; float: none; margin: 5px 5px 35px 5px; position: relative; }
}