#about {
	clear: both;
	position: relative;
}
#about .top {
	position: relative;
	z-index: 100;
	overflow: hidden;
}
#about .top .bg {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
}
#about .top .group1,
#about .top .group2,
#about .top .group3,
#about .top .group4 {
	position: relative;
	overflow: hidden;
}
#about .top .ratio1 {
	position: relative;
	z-index: 2;
}
#about .top .ratio2 {
	display: none;
}
#about .top .ratio3 {
	display: none;
}
#about .top img {
	width: 100%;
}
#about .top .item {
	display: block;
	overflow: hidden;
	position: absolute;
	z-index: 5;
}


#about .top .item:hover .quad {
	background-color: rgba(0, 0, 0, 0.5);
}
#about .top .item:hover .icon {
	opacity: 1;
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
}
#about .top .item .quad {
	position: absolute;
	z-index: 10;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0);
}
#about .top .item .icon {
	background-repeat: no-repeat;
	background-position: center center;
	position: absolute;
	z-index: 11;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2);
}
#about .top .item .iconFacebook {
	background-image: url('../images/site/supporters_icon_facebook.svg');
}
#about .top .item .iconInstagram {
	background-image: url('../images/site/supporters_icon_instagram.svg');
}
#about .top .item .iconSite {
	background-image: url('../images/site/supporters_icon_site.svg');
}




#about .top .itemTxt {
	position: relative;
	z-index: 5;
}
#about .top .missaoTxt {
	background-image: url('../images/site/about_missao.png');
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
}
#about .top .visaoTxt {
	background-image: url('../images/site/about_visao.png');
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
}
#about .top .valoresTxt {
	background-image: url('../images/site/about_valores.png');
	background-position: right top;
	background-repeat: no-repeat;
	background-size: cover;
}
#about .top .txt {
	color: #FFFFFF;
	padding: 80px 40px 40px;
}
#about .top .txt h1 {
	margin-bottom: 20px;
}


#about .top .item_1_1 {
	width: calc(100% / 6);
}
#about .top .item_1_2 {
	width: calc(100% / 6);
}
#about .top .item_2_1 {
	width: calc(100% / 3);
}
#about .top .item_2_2 {
	width: calc(100% / 3);
}
#about .top .item_4_3 {
	width: 100%;
	background-color: #E2261C;
}

#about .top .group1 > a:nth-child(1) {
	top: 0;
	left: calc(16.66% * 3);
}
#about .top .group1 > a:nth-child(2) {
	top: 0;
	left: 0;
}
#about .top .group1 > a:nth-child(3) {
	top: 0;
	left: 16.66%;
}
#about .top .group1 > a:nth-child(4) {
	top: 50%;
	left: 0;
}
#about .top .group1 > a:nth-child(5) {
	top: 50%;
	left: calc(16.66% * 2);
}
#about .top .group1 > a:nth-child(6) {
	top: 0;
	left: calc(16.66% * 2);
}
#about .top .group1 > a:nth-child(7) {
	top: 0%;
	left: calc(16.66% * 4);
}

#about .top .group2 > a:nth-child(1) {
	top: 0;
	left: 0;
}
#about .top .group2 > a:nth-child(2) {
	top: 0;
	left: 16.66%;
}
#about .top .group2 > a:nth-child(3) {
	top: 0;
	left: calc(16.66% * 2);
}
#about .top .group2 > a:nth-child(4) {
	top: 0;
	left: calc(16.66% * 3);
}
#about .top .group2 > a:nth-child(5) {
	top: 0;
	left: calc(16.66% * 4);
}
#about .top .group2 > a:nth-child(6) {
	top: 0;
	left: calc(16.66% * 5);
}
#about .top .group2 > a:nth-child(7) {
	top: 50%;
	left: calc(16.66% * 2);
}
#about .top .group2 > a:nth-child(8) {
	top: 50%;
	left: calc(16.66% * 5);
}

#about .top .group3 > a:nth-child(1) {
	top: 0;
	left: 0;
}
#about .top .group3 > a:nth-child(2) {
	top: 0;
	left: calc(16.66% * 2);
}
#about .top .group3 > a:nth-child(3) {
	top: 0;
	left: calc(16.66% * 3);
}
#about .top .group3 > a:nth-child(4) {
	top: 0;
	left: calc(16.66% * 4);
}
#about .top .group3 > a:nth-child(5) {
	top: 0;
	left: calc(16.66% * 5);
}
#about .top .group3 > a:nth-child(6) {
	top: 50%;
	left: calc(16.66% * 3);
}

#about .top .group4 > a:nth-child(1) {
	top: 0;
	left: 0;
}
#about .top .group4 > a:nth-child(2) {
	top: 0;
	left: calc(16.66% * 2);
}
#about .top .group4 > a:nth-child(3) {
	top: 0;
	left: calc(16.66% * 4);
}
#about .top .group4 > a:nth-child(4) {
	top: 50%;
	left: 0;
}
#about .top .group4 > a:nth-child(5) {
	top: 50%;
	left: 16.66%;
}

#about .bottom {
	position: relative;
	background-image: url('../images/site/about_bg_bottom.jpg');
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: contain;
	background-color: #bdd5d9;
	text-align: center;
	padding: 80px 30px;
}
#about .bottom .dgr01 {
	display: none;
}
#about .bottom .txtWrapper {
	overflow: hidden;
	padding: 40px 0;
}
#about .bottom h1 {
	font-weight: bold;
	line-height: 1.25em;
}
#about .bottom .txtWrapper p {
	text-align: justify;
	line-height: 2em;
}
#about .bottom .txtWrapper p:nth-child(1) {
	margin-bottom: 20px;
}
#about .bottom .txtLegend {
	position: relative;
	clear: both;
	font-family: 'Oswald', sans-serif;
	font-size: 1.25em;
	font-weight: bold;
	background-color: #000000;
	color: #FFFFFF;
	padding: 40px 0 60px;
	margin-bottom: 35%;
}
#about .bottom .txtLegend span {
	color: #E2261C;
}
#about .bottom .txtLegend div:nth-child(2) {
	font-size: 0.8em;
}
#about .bottom .txtLegend .bones {
	position: absolute;
	bottom: -45px;
	background-image: url('../images/site/bones.svg');
	background-position: center center;
	background-repeat: no-repeat;
	width: 100%;
	height: 87px;
}

/* ===== MEDIA QUERIES ===== */
@media only screen and (min-width: 480px) {
	#about .bottom .txtLegend {
		font-size: 1.5em;
	}
}

@media only screen and (min-width: 640px) {
	#about .bottom {
		padding: 140px 30px;
	}
	#about .bottom .txtWrapper p:nth-child(1) {
		float: left;
		width: 45%;
		margin-bottom: 0;
	}
	#about .bottom .txtWrapper p:nth-child(2) {
		float: right;
		text-align: justify;
		width: 45%;
	}
	#about .bottom .txtLegend {
		font-size: 2em;
	}
}

@media only screen and (min-width: 800px) {
	#about .top .ratio1 {
		display: none;
	}
	#about .top .ratio2 {
		display: block;
		position: relative;
		z-index: 2;
	}
	#about .top .group1,
	#about .top .group2,
	#about .top .group3,
	#about .top .group4 {
		position: absolute;
		width: 100%;
		height: 100%;
	}
	#about .top .item_1_1 {
		width: calc(100% / 6);
	}
	#about .top .item_1_2 {
		width: calc(100% / 6);
	}
	#about .top .item_2_1 {
		width: calc(100% / 3);
	}
	#about .top .item_2_2 {
		width: calc(100% / 3);
	}
	#about .top .item_4_3 {
		width: 50%;
	}
	#about .top .itemTxt {
		position: absolute;
	}
	#about .top .txt {
		position: absolute;
		z-index: 3;
		left: 10%;
		bottom: 10%;
		color: #FFFFFF;
		margin-right: 10%;
		padding: 0;
	}

	#about .top .group1 > a:nth-child(1) {
		top: calc(6.25% * 2);
		left: calc(16.66% * 2);
	}
	#about .top .group1 > a:nth-child(2) {
		top: 0;
		left: 0;
	}
	#about .top .group1 > a:nth-child(3) {
		top: 0;
		left: calc(16.66% * 2);
	}
	#about .top .group1 > a:nth-child(4) {
		top: calc(6.25% * 4);
		left: calc(16.66% * 2);
	}
	#about .top .group1 > a:nth-child(5) {
		top: calc(6.25% * 3);
		left: 0;
	}
	#about .top .group1 > a:nth-child(6) {
		top: calc(6.25% * 3);
		left: calc(16.66% * 5);
	}
	#about .top .group1 > a:nth-child(7) {
		top: 6.25%;
		left: 0;
	}

	#about .top .missaoTxt {
		top: 0;
		left: 50%;
	}

	#about .top .group2 > a:nth-child(1) {
		top: calc(6.25% * 4);
		left: calc(16.66% * 5);
	}
	#about .top .group2 > a:nth-child(2) {
		top: calc(6.25% * 6);
		left: calc(16.66% * 3);
	}
	#about .top .group2 > a:nth-child(3) {
		top: calc(6.25% * 5);
		left: calc(16.66% * 4);
	}
	#about .top .group2 > a:nth-child(4) {
		top: calc(6.25% * 8);
		left: 0;
	}
	#about .top .group2 > a:nth-child(5) {
		top: calc(6.25% * 10);
		left: calc(16.66% * 2);
	}
	#about .top .group2 > a:nth-child(6) {
		top: calc(6.25% * 9);
		left: 16.66%;
	}
	#about .top .group2 > a:nth-child(7) {
		top: calc(6.25% * 9);
		left: calc(16.66% * 2);
	}
	#about .top .group2 > a:nth-child(8) {
		top: calc(6.25% * 9);
		left: calc(16.66% * 5);
	}

	#about .top .visaoTxt {
		top: 31.25%;
		left: 0;
	}

	#about .top .group3 > a:nth-child(1) {
		top: calc(6.25% * 7);
		left: calc(16.66% * 4);
	}
	#about .top .group3 > a:nth-child(2) {
		top: calc(6.25% * 12);
		left: 0;
	}
	#about .top .group3 > a:nth-child(3) {
		top: calc(6.25% * 13);
		left: calc(16.66% * 2);
	}
	#about .top .group3 > a:nth-child(4) {
		top: calc(6.25% * 13);
		left: calc(16.66% * 5);
	}
	#about .top .group3 > a:nth-child(5) {
		top: calc(6.25% * 14);
		left: calc(16.66% * 2);
	}
	#about .top .group3 > a:nth-child(6) {
		top: calc(6.25% * 12);
		left: 16.66%;
	}

	#about .top .valoresTxt {
		top: 62.5%;
		left: 50%;
	}

	#about .top .group4 > a:nth-child(1) {
		top: calc(6.25% * 13);
		left: calc(16.66% * 3);
	}
	#about .top .group4 > a:nth-child(2) {
		top: calc(6.25% * 10);
		left: 0;
	}
	#about .top .group4 > a:nth-child(3) {
		top: calc(6.25% * 14);
		left: calc(16.66% * 4);
	}
	#about .top .group4 > a:nth-child(4) {
		top: calc(6.25% * 14);
		left: 16.66%;
	}
	#about .top .group4 > a:nth-child(5) {
		top: calc(6.25% * 15);
		left: 0;
	}
}

@media only screen and (min-width: 1024px) {
	#about .top .txt {
		left: 10%;
		bottom: 10%;
		margin-right: 20%;
	}
	#about .bottom {
		background-position: right center;
		background-size: cover;
	}
	#about .bottom .txtWrapper {
		display: inline-block;
		width: 955px;
		padding: 40px 0 30%;
		margin: 0 auto;
	}
	#about .bottom .txtLegend {
		position: absolute;
		z-index: 2;
		bottom: 0;
		right: 0;
		width: 50%;
		padding: 40px 0 50px;
		margin: 0;
	}
}

@media only screen and (min-width: 1280px) {
	#about .top {
		margin-top: -8.33%;
	}
	#about .top .bg {
		top: 10%;
		height: 90%;
	}

	#about .top .ratio2 {
		display: none;
	}
	#about .top .ratio3 {
		display: block;
		position: relative;
		z-index: 2;
	}

	#about .top .item_1_1 {
		width: 8.33%;
	}
	#about .top .item_1_2 {
		width: 8.33%;
	}
	#about .top .item_2_1 {
		width: 16.66%;
	}
	#about .top .item_2_2 {
		width: 16.66%;
	}
	#about .top .item_4_3 {
		width: 33.33%;
	}

	#about .top .txt {
		left: 10%;
		bottom: 12.5%;
		margin-right: 20%;
	}

	#about .top .group1 > a:nth-child(1) {
		top: 0;
		left: 8.33%;
	}
	#about .top .group1 > a:nth-child(2) {
		top: 0;
		left: calc(8.33% * 10);
	}
	#about .top .group1 > a:nth-child(3) {
		top: 10%;
		left: calc(8.33% * 2);
	}
	#about .top .group1 > a:nth-child(4) {
		top: 10%;
		left: calc(8.33% * 5);
	}
	#about .top .group1 > a:nth-child(5) {
		top: 10%;
		left: calc(8.33% * 9);
	}
	#about .top .group1 > a:nth-child(6) {
		top: 20%;
		left: 8.33%;
	}
	#about .top .group1 > a:nth-child(7) {
		top: 20%;
		left: calc(8.33% * 6);
	}

	#about .top .missaoTxt {
		top: 20%;
		left: calc(8.33% * 2);
	}

	#about .top .group2 > a:nth-child(1) {
		top: 20%;
		left: 0;
	}
	#about .top .group2 > a:nth-child(2) {
		top: 30%;
		left: 8.33%;
	}
	#about .top .group2 > a:nth-child(3) {
		top: 40%;
		left: calc(8.33% * 6);
	}
	#about .top .group2 > a:nth-child(4) {
		top: 40%;
		left: calc(8.33% * 11);
	}
	#about .top .group2 > a:nth-child(5) {
		top: 50%;
		left: 0;
	}
	#about .top .group2 > a:nth-child(6) {
		top: 50%;
		left: calc(8.33% * 4);
	}
	#about .top .group2 > a:nth-child(7) {
		top: 30%;
		left: calc(8.33% * 8);
	}
	#about .top .group2 > a:nth-child(8) {
		top: 50%;
		left: calc(8.33% * 6);
	}

	#about .top .visaoTxt {
		top: 40%;
		left: calc(8.33% * 7);
	}

	#about .top .group3 > a:nth-child(1) {
		top: 20%;
		left: calc(8.33% * 10);
	}
	#about .top .group3 > a:nth-child(2) {
		top: 50%;
		left: calc(8.33% * 5);
	}
	#about .top .group3 > a:nth-child(3) {
		top: 70%;
		left: calc(8.33% * 5);
	}
	#about .top .group3 > a:nth-child(4) {
		top: 80%;
		left: 0;
	}
	#about .top .group3 > a:nth-child(5) {
		top: 70%;
		left: calc(8.33% * 8);
	}
	#about .top .group3 > a:nth-child(6) {
		top: 50%;
		left: calc(8.33% * 2);
	}

	#about .top .valoresTxt {
		top: 60%;
		left: 8.33%;
	}

	#about .top .group4 > a:nth-child(1) {
		top: 70%;
		left: calc(8.33% * 10);
	}
	#about .top .group4 > a:nth-child(2) {
		top: 70%;
		left: calc(8.33% * 6);
	}
	#about .top .group4 > a:nth-child(3) {
		top: 90%;
		left: 8.33%;
	}
	#about .top .group4 > a:nth-child(4) {
		top: 80%;
		left: calc(8.33% * 9);
	}
	#about .top .group4 > a:nth-child(5) {
		top: 90%;
		left: calc(8.33% * 8);
	}

	#about .bottom .dgr01 {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		background-image: url('../images/site/about_dgr_01.png');
		background-position: center bottom;
		background-repeat: repeat-x;
		width: 100%;
		height: 100px;
	}
	#about .bottom .txtLegend {
		font-size: 2.5em;
	}
}

@media only screen and (min-width: 1600px) {
	#about .bottom .txtLegend {
		font-size: 3em;
		padding: 50px 0 60px;
	}
	#about .bottom .txtLegend div:nth-child(2) {
		font-size: .5em;
	}
}