@CHARSET "ISO-8859-1";

/*
 *
 * Área de Comunicação (notícias)
 *
 */

/*
	Referências:
	Absolute Positioning and Stretching: http://www.vanseodesign.com/css/vertical-centering/
	http://designshack.net/articles/css/build-an-animated-photo-wall-with-css/
	http://stackoverflow.com/questions/16885690/css-background-gradient-with-offset
 */

/*---------------------------------------------------- Versão painel */

#painel_noticias {
	width: 590px;
	height: 480px;
	margin: auto;
	position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

#painel_noticias a {
	text-decoration: none;
}

#painel_noticias ul.painel {
	position: absolute;
	top: 40px;
	list-style-type: none;
}

#painel_noticias .painel li {
	position: absolute;
	overflow: hidden;
}

#painel_noticias .painel > li {
	cursor: pointer;
}

#painel_noticias .painel .tile_image {
	overflow: hidden;	/* corta excedente da imagem */
}

#painel_noticias .painel img {
	width: 100%;
	height: auto;	/* evita que a imagem fique distorcida */
	/*height: 100%;*/
}

#painel_noticias .painel p {
	font-family: 'Segoe UI', Helvetica, Arial, sans-serif;
	font-size: 10pt;	
	padding: 10px 10px 0 10px;
	color: #ffffff;
	height: calc(100% - 20px);
}

#painel_noticias .painel .tile_blue {
	background-color: #406180;
}

#painel_noticias .painel .tile_green {
	background-color: #7C9C37;
}

#painel_noticias .painel .tile_largetext p {
	font-size: 13pt;
}

/* Efeitos com mouseover */

#painel_noticias .painel .tile_text:hover {
	background-color: #505050 !important;
}

#painel_noticias .painel .tile_imagetext:after {
	content: "";
	pointer-events: none;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}

#painel_noticias .painel .tile_imagetext:hover:after {
    background-color: #0000a0;
	opacity: .1 !important;
}

#painel_noticias .painel .tile_mask:hover {
    opacity: .1;
}

#painel_noticias .painel .tile_imagetext:after,
#painel_noticias .painel .tile_text {
	-webkit-transition: all .7s ease;
	-moz-transition: all .7s ease;
	-o-transition: all .7s ease;
	-ms-transition: all .7s ease;
	transition: all .7s ease;
}

#painel_noticias .painel .tile_imagetext:hover:after,
#painel_noticias .painel .tile_text:hover {
	-webkit-transition: all .7s ease;
	-moz-transition: all .7s ease;
	-o-transition: all .7s ease;
	-ms-transition: all .7s ease;
	transition: all .7s ease;
}

/* Layout dos tiles */

#painel_noticias .painel #tile1 { left: 0; top: 0; width: 440px; height: 290px; }
	#painel_noticias .painel #tile1-1 { left: 0; top: 0; width: 100%; height: 220px; }
	#painel_noticias .painel #tile1-2 { left: 0; top: 220px; width: 100%; height: 70px; }
#painel_noticias .painel #tile2 { left: 450px; top: 0; width: 140px; height: 140px; }
#painel_noticias .painel #tile3 { left: 450px; top: 150px; width: 140px; height: 140px; }
#painel_noticias .painel #tile4 { left: 0; top: 300px; width: 140px; height: 140px; }
#painel_noticias .painel #tile5 { left: 150px; top: 300px; width: 140px; height: 140px; }
#painel_noticias .painel #tile6 { left: 300px; top: 300px; width: 290px; height: 140px; }
	#painel_noticias .painel #tile6-1 { left: 0; top: 0; width: 100%; height: 80px; }
	#painel_noticias .painel #tile6-2 { left: 0; top: 80px; width: 100%; height: 60px; }

/*---------------------------------------------------- Versão texto */

#noticias .listagem .ui-widget-content {
	border: none;
}

#noticias .listagem li {
	color: #1a1a1a;
	font-size: 10pt;
	line-height: 35px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	border-bottom: 1px solid #e5e5e5;
}

#noticias .listagem p {
	display: inline;
}

#noticias .listagem p.mp-date {
    padding-right: 30px;
    text-align: right;
    width: 70px;
    display: inline-block;
}

#noticias .listagem a {
	color: #266B9E;
	cursor: pointer;
	text-decoration: none;
}

#noticias .listagem a:hover {
	text-decoration: underline;
}