#texte h2 {
	font-size:30px;
	margin-top:30px;
}

#texte .courrier {
	top:-100px;
}

#texte .mail {
	top:100px;
} 

#texte .tel {
	top:200px;
}

.contact .email {
	width:10%;
}

.contact * { -webkit-backface-visibility: hidden; }



.contact { 
		position: absolute;
		left: 51%;
		top: 50%;
		margin-left: -50px;
		margin-top: -160px;
		height: 250px;
		width: 250px;
			
		border-radius: 2px;
		-ms-border-radius: 2px;
		-moz-border-radius: 2px;
		-o-border-radius: 2px;
		-webkit-border-radius: 2px;
}
.contact .envelope {
		position: absolute;
		height: 93px;
		width: 165px;
		left: 50%;
		margin-left: -83px;
		top: 50%;
		margin-top: -50px;
		background: #F9F9F9;
		
		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: -3px;
		left: 0px;
		width: 100%;
		height: 73px;
		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: -130px;
  
		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: 70px solid black;
}
.contact .envelope .outer .inner {
		position: absolute;
		left: -81px;
		top: -73px;
		border-left: 81px solid transparent;
		border-right: 80px solid transparent;
		border-top: 68px solid orange;
}
.contact .envelope .bottom {
		position: absolute;
		z-index: 20;
		bottom: 0px;
		left: 2px;
		border-left: 81px solid transparent;
		border-right: 80px solid transparent;
		border-bottom: 45px solid orange;
}
.contact .envelope .left {
		position: absolute;
		z-index: 20; top: 0px;
		left: 0px;
		border-left: 81px solid orange;
		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 orange;
		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: black;
}
.contact .envelope .paper { /* enveloppe */
		position: absolute;
		height: 65px;
		padding-top: -45px;
		width: 100%;
		border-radius:5px;
		top: 0px;
		left: 0px;
		background: white;
		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: -130px;
  		height:110px;
  		padding-top:10px;
		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  {
		position: relative;
		display: block;
		font-size: 14px;
		margin:0px;
		margin-bottom: 0px;
		padding:0;
		text-align: center;
		color: #333;
		font-weight:bold;
		text-decoration: none;

}

.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: red;
}
.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: 12px;
		
}

#contact p {
	position:absolute;
	margin-top:300px;
	margin-left:350px;
}