#bg {
	position: absolute;
	left: 0px;
	top: 0px;
	height: 100%;
	width: 100%;
}
.contact {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	border-radius: 2px;
	-ms-border-radius: 2px;
	-moz-border-radius: 2px;
	-o-border-radius: 2px;
	-webkit-border-radius: 2px;
}
.contact .envelope {
	position: absolute;
	height: 70%;
	width: 70%;
	margin-top: -50px;
	background: #f1f1f1;
	transition: margin-top 300ms;
	-ms-transition: margin-top 300ms;
	-moz-transition: margin-top 300ms;
	-o-transition: margin-top 300ms;
	-webkit-transition: margin-top 300ms;
}
.contact:hover .envelope {
	transition-delay: 150ms;
	-ms-transition-delay: 150ms;
	-moz-transition-delay: 150ms;
	-o-transition-delay: 150ms;
	margin-top: -20px;
}
.contact .envelope .top {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 30%;
	z-index: 30;
	overflow: hidden;

	transform-origin: top;
	-ms-transform-origin: top;
	-moz-transform-origin: top;
	-o-transform-origin: top;
	-webkit-transform-origin: top;

	transition: transform 300ms 150ms, z-index 0ms 150ms, height 300ms 0ms, top 300ms 0ms;
	-ms-transition: -ms-transform 300ms 150ms, z-index 0ms 150ms, height 300ms 0ms, top 300ms 0ms;
	-moz-transition: -moz-transform 300ms 150ms, z-index 0ms 150ms, height 300ms 0ms, top 300ms 0ms;
	-o-transition: -o-transform 300ms 150ms, z-index 0ms 150ms, height 300ms 0ms, top 300ms 0ms;
	-webkit-transition: -webkit-transform 300ms 150ms, z-index 0ms 150ms, height 300ms 0ms, top 300ms 0ms;
}
.contact:hover .envelope .top {
	transition: transform 300ms 0ms, height 300ms 150ms, top 300ms 150ms;
	-ms-transition: -ms-transform 300ms 0ms, height 300ms 150ms, top 300ms 150ms;
	-moz-transition: -moz-transform 300ms 0ms, height 300ms 150ms, top 300ms 150ms;
	-o-transition: -o-transform 300ms 0ms, height 300ms 150ms, top 300ms 150ms;
	-webkit-transition: -webkit-transform 300ms 0ms, height 300ms 150ms, top 300ms 150ms;

	height: 10px;
	top: -60px;

	transform: rotateX(180deg);
	-ms-transform: rotateX(180deg);
	-moz-transform: rotateX(180deg);
	-o-transform: rotateX(180deg);
	-webkit-transform: rotateX(180deg);
}
.contact .envelope .outer {
	position: absolute;
	bottom: 0px;
	left: 0px;
	border-left: 83px solid transparent;
	border-right: 82px solid transparent;
	border-top: 150px solid #c9c9c9;
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	display: flex;
}
.contact .envelope .outer .inner {
	position: absolute;
	bottom: 20px;
	width: 80%;
	height: 100%;
	background: aliceblue;
	margin: auto;
}
.contact .envelope .bottom {
	position: absolute;
	z-index: 20;
	bottom: 0;
	left: 0;
	background-color: #ececec;
	width: 100%;
	height: 100%;
	border-bottom: 25px solid #c9c9c9;
	border-right: 25px solid #c9c9c9;
	border-left: 25px solid #c9c9c9;
}
.contact .envelope .left {
	position: absolute;
	z-index: 20; top: 0px;
	left: 0px;
	border-left: 81px solid #333;
	border-top: 45px solid transparent;
	border-bottom: 45px solid transparent;
}
.contact .envelope .right {
	position: absolute;
	z-index: 20;
	top: 0px;
	right: 0px;
	border-right: 80px solid #b4b3b3;
	border-top: 45px solid transparent;
	border-bottom: 45px solid transparent;
}
.contact .envelope .cover {
	position: absolute;
	z-index: 15;
	bottom: 0px;
	left: 0px;
	height: 55%;
	width: 100%;
	background: #EEE;
}
.contact .envelope .paper {
	position: absolute;
	height: 83px;
	padding-top: 10px;
	width: 100%;
	top: 0px;
	left: 0px;
	background: #F9F9F9;
	z-index: 10;
	transition: margin-top 300ms 0ms;
	-ms-transition: margin-top 300ms 0ms;
	-moz-transition: margin-top 300ms 0ms;
	-o-transition: margin-top 300ms 0ms;
	-webkit-transition: margin-top 300ms 0ms;
}
.contact:hover .envelope .paper {
	margin-top: -60px;
	transition: margin-top 300ms 150ms;
	-ms-transition: margin-top 300ms 150ms;
	-moz-transition: margin-top 300ms 150ms;
	-o-transition: margin-top 300ms 150ms;
	-webkit-transition: margin-top 300ms 150ms;
}
.contact .envelope .paper a {
	position: relative;
	display: block;
	font-size: 14px;
	margin: 5px;
	margin-bottom: 0px;
	text-align: center;
	color: #333;
	text-decoration: none;
}
.contact .envelope .paper a.call .i {
	position: absolute;
	top: 2px;
	left: 20px;
	display: inline-block;
	width: 3px;
	height: 5px;
	border-width: 5px 0 5px 2px;
	border-style: solid;
	border-color: #d270fc;
	background: transparent;

	transform: rotate(-30deg);
	-ms-transform: rotate(-30deg);
	-moz-transform: rotate(-30deg);
	-o-transform: rotate(-30deg);
	-webkit-transform: rotate(-30deg);

	border-top-left-radius: 3px 5px;
	border-bottom-left-radius: 3px 5px;
	-moz-border-radius-topleft: 3px 5px;
	-moz-border-radius-bottomleft: 3px 5px;
	-webkit-border-top-left-radius: 3px 5px;
	-webkit-border-bottom-left-radius: 3px 5px;

	transition: border-color 300ms;
	-ms-transition: border-color 300ms;
	-moz-transition: border-color 300ms;
	-o-transition: border-color 300ms;
	-webkit-transition: border-color 300ms;
}
.contact .envelope .paper a {
	color: #333;

	transition: color 200ms;
	-ms-transition: color 200ms;
	-moz-transition: color 200ms;
	-o-transition: color 200ms;
	-webkit-transition: color 200ms;
}
.contact .envelope .paper a:hover {
	color: #ae75b1;
}
.contact .envelope .paper a.call:hover .i {
	border-color: #DDD;
}
.contact .envelope .paper a.mail .i {
	position: absolute;
	top: 0px;
	left: 17px;
	display: inline-block;
	font-size: 13px;
	font-weight: bold;
}
.centrar{
	justify-content: center;
	align-items: center;
	display: flex;
}
.cursor{
	cursor: pointer;
}