﻿.horizontal_scroll{
	overflow: hidden ;
	white-space: nowrap ;
	position: relative ;
}

div.next, div.previous{
	position: absolute ;
	width: 50px ;
	height: 50px ;
	background-color: rgba( 81, 81, 81, 0.75 ) ;
	border-radius: 50% ;
	box-shadow: 0px 0px 2px #BFBFBF ;
	top: 50% ;
	right: 5px ;
	transform: translateY( -50% ) ;
	cursor: pointer ;
}

.quadro .img_quadro.fotografia{
	cursor: zoom-in ;
}

div.next:after, div.previous:after{
	content: "";
	position: absolute;
	border-top-style: solid;
	border-left-style: solid;
	border-bottom-style: solid;
	border-top-width: 10px;
	border-left-width: 20px;
	border-bottom-width: 10px;
	border-top-color: transparent;
	border-left-color: rgba( 255, 255, 255, 0.75 ) ;
	border-bottom-color: transparent;
	top: 50% ;
	left: 50% ;
	
	/*transform: translate( -50%, -50% ) ;*/
	margin: -10px 0px 0px -10px ;
}

div.noticia{
	white-space: normal ;
	font-size: 16px ;
	color: #000 ;
	padding: 12px ;
	line-height: 150% ;
	text-align: left ;
}

div.previous{
	right: auto ;
	left: 5px ;
	display: none ;
}

div.previous:after{
	border-left: 0px none ;
	border-right: 20px solid rgba( 255, 255, 255, 0.75 ) ;
}

div.previous:hover, div.next:hover{
	background-color: rgba( 128, 128, 128, 0.75 ) ;
}

div.quadro {
	width: 340px ;
	/*width: 33.33% ;*/
	display: inline-block ;
	border: 18px solid transparent ;
	border-top: 0px none ;
	border-bottom: 0px none ;
	vertical-align: top ;
}

div.quadro.fotos{
	/*width: 25% ;*/
	width: 453px ;
}

div.sombra.osgatos{
	box-shadow: 3px 3px 3px -2px #AAA, -3px 3px 3px -2px #AAA ;
	border-radius: 6px ;
}

div.sombra.osgatos img{
	border-radius: 6px ;
}

div.sombra.osgatos div.titulo.osgatos{
	border-radius: 0px 0px 6px 6px ;
}

div.sombra.noticias{
	max-height: 492px ;
	height: 300px ;
	height: 247px ;
	width: 100% ;
	background-color: #FFF ;
	position: relative ;
	box-shadow: 3px 3px 3px -2px #DDD, -3px 3px 3px -2px #DDD ;
	overflow: hidden ;
	border-radius: 6px ;
}

.sombra{
	position: relative ;
	margin-bottom: 6px ;
	box-shadow: 3px 3px 3px -2px #888, -3px 3px 3px -2px #888 ;
}

.quadro.loaded{
	/*display: none ;*/
	position:absolute ;
	top: -5000px ;
	opacity: 0 ;
}

div.quadro img{
	width: 100% ;
	cursor: pointer ;
	cursor: zoom-in ;
}

div.quadro div.img_quadro{
	width: 100% ;
	height: 250px ;
	height: 258px ;
	background-size: 100% auto ;
	background-position: center 25% ;
	background-repeat: no-repeat ;
	position: relative ;
	cursor: pointer ;
	background-color: #DFDFDF ;
	background-color: #EFEFEF ;
	overflow: hidden ;
	
	transition: 0.25s ;
}

div.img_quadro:after, div.img_quadro:before{
	content: "" ;
	position: absolute ;
	width: 100% ;
	height: 100% ;
	background-color: #000 ;
	opacity: 0.5 ;
	top: 0px ;
}

div.img_quadro:before{
	width: 50% ;
	left: -50% ;
}


div.img_quadro:after{
	right: 0px ;
}

div.quadro div.titulo:after{
	display: table ;
	clear: both;
	content: "" ;
}

div.img_quadro:hover:before, div.img_quadro:hover:after{
	width: 50% ;
	animation: rtl 0.25s ;
	animation-fill-mode: forwards ;
}

div.img_quadro:hover:after{
	animation-name: ltr ;
}

@keyframes rtl{
	from{ left: 0px; }
	to{ left: -50% ; }
}

@keyframes ltr{
	from{ right: 0px; }
	to{ right: -50% ; }
}


.center1360.all{
	text-align:center ;
}

.all .quadro{
	margin-bottom: 36px ;
}

div.titulo{
	position: absolute ;
	bottom: 0px ;
	left: 0px ;
	width: 100% ;
	background-color: rgba( 0, 0, 0, 0.5 ) ;
	color: #FFF ;
	font-size: 15px ;
	text-align: center;
	font-weight: 700;
	white-space: normal ;
	padding: 12px;
}

div.titulo.osgatos{
	background-color: rgba( 255, 255, 255, 0.95 ) ;
	color: #000 ;
	padding-right: 31px ;
	box-shadow: 0px -2px 3px -1px #AAA ;
/*	position: relative ;*/
}

div.titulo.noticias{
	bottom: auto;
	top: 0px;
	position: relative;
	color: #444 ;
	text-align: left;
	font-size: 17px;
	background-color: transparent;
	background-color: rgba( 0, 0, 0, 0.0703125);
	box-shadow: 0px 6px 3px -6px rgba( 255, 102, 0, 0.375 ) ;
	margin-bottom: 0px;
}

div.quadro:nth-of-type( even ) div.titulo.noticias{
	box-shadow: 0px 6px 6px -6px #008db2; /*005A71 ;*/
	color: #DDD ;
	background-color: rgba( 0, 0, 0, .9 ) ;
}

a.download{
	display: inline-block ;
	position: absolute ;
	border-radius: 50% ;
	height: 25px ;
	width: 25px ;
	background-color: #00a6c0 ;
	text-align: center ;
	
	top: 50% ;
	right: 6px ;
	transform: translateY( -50% ) ;
	
	box-shadow: 0px 0px 1px #BFBFBF ;
}

.board_footer{
	position: absolute ;
	width: 100% ;
	left: 0px ;
	bottom: 0px ;
	background: #FFF ;
	background: linear-gradient( transparent, white ) ;
	padding: 12px ;
	padding-top: 225px ;
	padding-top: 182px ;
}

a.visit{
	background-image:url('../images/porta.png') ;
	background-color: #f7bd37 ;
	float: right;
	
	width: 21px ;
	height: 27px ;
	
	background-size: 100% ;
		
	cursor: pointer ;
	border: 0px none ;
}

a.visit:hover{
	background-color: #00a6c0 ;
}

a.download:hover{
	background-color: #f7bd37 ;
}

a.download:after{
	content: "" ;
	background-color: #FFF ;
	width: 40% ;
	height: 2px ;
	position: absolute ;
	top: 65% ;
	left: 50% ;
	transform: translateX( -50% ) ;
}

a.download:before{
	content: "";
	position: absolute;
	top: 35%;
	left: 50%;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: #FFF;
	border-right-color: transparent;
	border-left-color: transparent;
	border-top-width: 6px;
	border-right-width: 6px;
	border-left-width: 6px;
	transform: translateX( -50% );
}

div.quadro:nth-of-type( even ) a.download{
	background-color: #f7bd37 ;
}

div.quadro:nth-of-type( even ) a.download:hover{
	background-color: #00a6c0 ;
}

div.quadro:nth-of-type( even ) a.visit{
	background-color: #00a6c0 ;
}

div.quadro:nth-of-type( even ) a.visit:hover{
	background-color: #f7bd37 ;
}


.zoom {
	border: 24px solid rgba( 0, 0, 0, 0.75 ) ;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 5;
	overflow: hidden;
	display: none ;
	padding: 0px ;
	margin: 0px ;
}

.zoom div.table{
	position: relative ;
	width: 100% ;
	display: table ;
	height: 100% ;
	vertical-align: middle ;
	background-color: rgba( 255, 255, 255, 1 ) ;
}

.cell{
	display: table-cell ;
	text-align: center ;
	vertical-align: middle ;
	position: relative ;
}

.table .close{
	position: absolute ;
	top: 5px ;
	right: 5px ;
	cursor: pointer ;
	width: 20px ;
	height: 20px ;
	border-radius: 50% ;
	/*background-color: #DFDFDF ;*/
	overflow: hidden ;
}

.table .close:before, .table .close:after{
	content: "" ;
	width: 100% ;
	height: 1px ;
	background-color: #f00 ;
	position: absolute ;
	top: 10px ;
	transform: rotate( 45deg ) ;
	/*transform: translate( 0px, -11px ) rotate( 45deg ) ;*/
}

.table .close:after{
	transform: rotate( -45deg ) ;
}

.updatePhoto{
	position: absolute;
	top: 50%;
	border-top-style: solid;
	border-left-style: solid;
	border-top-width: 1px;
	border-left-width: 1px;
	border-top-color: #CCC;
	border-left-color: #CCC;
	width: 15px ;
	height: 15px ;
	transform: rotate( -45deg ) ;
	left: 11px ;
	margin-top: -8px ;
}

.updatePhoto.toRight{
	left: auto ;
	right: 11px ;
	transform: rotate( 135deg ) ;
}

.updatePhoto.toRight.on, .updatePhoto.toLeft.on{
	cursor: pointer ;
	border-top-color: #333;
	border-left-color: #333;
}

.paging{
	font-size: 16px ;
	color: #222 ;
	position: absolute ;
	bottom: 0px ;
	left: 0px ;
	width: 100% ;
	text-align: center ;
	padding-bottom: 2px ;
}

.page{
	color: #666 ;
}

.pages{
	color: #444 ;
}

.zoom img {
	margin: auto;
	display: block;
	
	width: 0px ;
	height: 0px ;
	
	box-shadow: 0px 0px 3px #888 ;
}

.inverse .sombra{
	box-shadow: 0px 1px 5px 0px #AAA ;
}

@keyframes zoom{
	from{ transform: scale( 0 ) }
	to{ transform: scale( 1 ) }
}

div.quadro.floatLeft{
	width: 378px ;
	float: right ;
	border-width: 18px ;
/*	border-right-width: 0px ;*/
}

div.quadro.floatLeft div.img_quadro{
	height: 211px ;
}


div.quadro.floatLeft div.img_quadro{
	transition: height 0.25s ;
}

div.quadro.floatLeft{
	transition: width 0.25s ;
}

@media ( max-width: 775px ){
	div.quadro.floatLeft{
		width: 340px ;
	}

	div.quadro.floatLeft div.img_quadro{
		height: 188px ;
	}
}

@media (max-width: 640px ){
	div.quadro.floatLeft{
		width: 100% ;
		float: none ;
		border-width: 18px ;
	}

	div.quadro.floatLeft div.img_quadro{
		height: calc( 61.8vw - 36px ) ;
	}

}

@media ( max-width: 921px ){
	div.divisor{
		width: 95% ;
		left: 2.5% ;
	}
	
	#all_records div.quadro.fotos{
		width: 50% ;
	}
		
	#all_records div.quadro.fotos div.img_quadro{
		height: calc( 30.9vw - 36px ) ;
	}
	
}

@media ( max-width: 711px ){
	#all_records div.quadro.fotos{
		width: 453px ;
	}
		
	#all_records div.quadro.fotos div.img_quadro{
		height: 258px ;
	}
}

@media ( max-width: 475px ){
	#all_records div.quadro.fotos, div.quadro.fotos{
		width: 100% ;
	}
			
	 #all_records div.quadro.fotos div.img_quadro, div.quadro.fotos div.img_quadro{
		height: calc( 61.8vw - 36px ) ;
	}
}

@media ( max-width:400px ){
	div.quadro{
		width: 100% ;
	}
}