/*
* @Project ASSESP
* @author  FABIANO KUERTEN <fabiano@3fk.com.br>
*/

body { background-color: #f1f1f1; }
header {height: 130px; box-shadow: inset 0px 25px 0 #222222, inset 0px 26px 0 #ffffff, 0px 1px 1px #aaaaaa; }
h1 {text-align: center;}
.filtro { margin: 30px 0px; padding: 10px 10px; background-color: #ffffff; box-shadow: 1px 1px 1px #999999; }
.filtro form fieldset { margin-bottom: 15px; padding: 20px 20px; border: 1px solid #000000; }
.filtro form legend { padding: 3px 20px; background: none; color: #000000; }
.filtro form label { float: left; margin: 10px 15px 0px 0px; font-size: 14px; color: #000000; }
.filtro form label span { font-style: italic; font-size: 12px; }
.filtro form input { display: block; padding: 5px; border: solid 1px #666666; transition: box-shadow 0.3s, border 0.3s; }
.filtro form button { padding: 5px 30px; border: 1px solid #666666; background-color: #333333; color: #ffffff;  transition-duration: 0.4s; cursor: pointer; }
.filtro form button:hover { background-color: #555555; }
.msg { font-size: 12px; color:#cc0000; }
.lista { display: grid; grid-template-columns: 1fr; grid-gap: 20px; }
.lista article { padding: 20px; border: 1px solid #ffffff; box-shadow: 0px 1px 1px #aaaaaa; background-color: #ffffff; }
.lista article img { vertical-align: middle; width: 100%; }
.lista article p { margin-top: 10px; color: #555555; line-height: 1.2; }
.lista article a { text-decoration: none; opacity: 0.8; }
.lista article a:hover { opacity: 1; }
.paginacao { grid-template-columns: 1fr; margin: 30px 0px; }
.paginacao p { text-align: center; }
.paginacao a { padding: 0 5px; text-decoration: none; color: #333333; }
.paginacao a:hover { text-decoration: underline; }

#path { margin-bottom: 40px; height: 20px; background-color: #ffffff; box-shadow: 0px 1px 1px #aaaaaa; }
#path p { padding-top: 5px; font: normal normal normal 10px Arial, sans-serif; line-height: 10px; color: #333333; }
#path a { text-decoration: none; color: #333333; }
#path a:hover { text-decoration: underline; }
#frmEdtTitulo { width: 230px; }
#frmDtInicial { width: 230px;}
#frmDtFinal { width: 230px;}
#btnFiltrar { margin: 25px 15px 0px 0px; width: 230px; }

@media only screen and (min-width: 320px) { }

@media only screen and (min-width: 481px) {
.filtro form label[for="frmEdtTitulo"] { float: none;}
.lista { grid-template-columns: 1fr 1fr; }
#frmEdtTitulo { width: 350px; }
#frmDtInicial { width: 100px; }
#frmDtFinal { width: 100px; }
#btnFiltrar { width: 100px; }
}

@media only screen and (min-width: 768px) {
.filtro form label[for="frmEdtTitulo"] { float: left;}
.lista { grid-template-columns: 1fr 1fr 1fr; }
#frmEdtTitulo { width: 300px; }
#frmDtInicial { width: 90px; }
#frmDtFinal { width: 90px; }
#btnFiltrar { width: 100px; }
}

@media only screen and (min-width: 1025px) {
.lista { grid-template-columns: 1fr 1fr 1fr 1fr; }
#frmEdtTitulo { width: 400px; }
#frmDtInicial { width: 120px; }
#frmDtFinal { width: 120px; }
#btnFiltrar { width: 120px; }
}

@media only screen and (min-width: 1300px) {
.filtro { margin: 30px 100px; padding: 10px 20px; }
.lista { margin: 0 100px; grid-template-columns: 1fr 1fr 1fr 1fr; }
#frmEdtTitulo { width: 500px; }
}