


.te-container{ width:940px; height:600px; margin:0px auto 00px auto; padding-top:25px; position:relative;}

#hab img{ z-index: 0; width:940px; margin:0 auto; position:absolute; left:0; right:0; opacity: 0.4;}
#hab2 img{ z-index: 0; width:740px; margin:0 auto; position:absolute; left:0; right:0; opacity: 0.4;}
#hab3 img{ z-index: 0; width:610px; margin:0 auto; position:absolute; left:0; right:0; opacity: 0.4;}
#hab4 img{ z-index: 0; width:440px; margin:0 auto; position:absolute; left:0; right:0; opacity: 0.4;}

.te-controls{ width:60px; height:40px; position:absolute; left:0; right:0; bottom:-12px; margin:0 auto; }

a.te-next{
	display: inline-block;
	font-size: 15px;
	background: rgb(134,151,145); color: #fff;
	line-height: 18px;
	cursor: pointer;
	text-overflow: ellipsis;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	font-family: inherit;
	}
	
a.te-next{ margin:5px auto; padding:5px 10px 5px 14px; position:absolute; left:0; right:0; margin:0 auto;}

a.te-next:hover{  color: #444;}
a.te-next:active{  color: #fff;}

.te-shadow{
	position: absolute;
	top: 30px;
	left: 50%;
	width: 373px;
	height: 470px;
	margin-left: -186px;
	background: transparent url(../images/shadow.png) no-repeat center bottom;
	}
	
.te-wrapper{ position:absolute; width:900px; height:550px; left:0px; right:0; margin:0 auto;}

#te-wrapper img{width:auto; max-width: 900px; height:100%; position:absolute; left:0px; right:0; margin:0 auto;
		border:10px solid rgb(134,151,145); }
		
		
#deco2{ width:200px; position:absolute; left:0; right:0; bottom:15px; margin:0 auto; }
#deco2 img{ width:100%; margin:0 auto; border:0px solid #666; opacity: 0.8;}		

/*******************************************************/
/****************** Cube Effects ***********************/
/*******************************************************/
.hide{display: none;}
.hideren{opacity: 0;}

.te-perspective{ -webkit-perspective: 1000; }

.te-cover, .te-transition{ -webkit-transform-style: preserve-3d; position: absolute;
			width: 900px; height: 550px; top: 0px; left: 0px; }
			
.te-cover.te-hide, .te-transition{ display: none; }
.te-images {display: none; }
.te-transition.te-show{ display: block; }

.te-cube-face{ position:absolute; width:900px; height:550px; display:block; overflow:hidden; }

.te-back, .te-front{ position: absolute; width: 100%; height: 100%; -webkit-backface-visibility: hidden; }
.te-front{ z-index: 2; }
.te-back{ z-index: 1; }

/***************** Cube1 ********************/
.te-cube1 .te-cube-front{
	-webkit-transform: scale3d(.825,.825,.825) translate3d(0,0,212px);
}
.te-cube1 .te-cube-top{
	-webkit-transform: scale3d(.825,.825,.825) rotate3d(1,0,0,90deg) translate3d(0,0,212px);
}
.te-cube1 .te-cube-bottom{
	-webkit-transform: scale3d(.825,.825,.825) rotate3d(1,0,0,-90deg) translate3d(0,0,212px);
}
.te-cube1 .te-cube-right{
	-webkit-transform: scale3d(.825,.825,.825) rotate3d(0,1,0,90deg) translate3d(0,0,212px);
}
.te-cube1 .te-cube-left{
	-webkit-transform: scale3d(.825,.825,.825) rotate3d(0,1,0,-90deg) translate3d(0,0,212px);
}
.te-cube1.te-show{
	-webkit-animation: cube1 0.5s ease-in-out;
}
@-webkit-keyframes cube1{
	0% { -webkit-transform: rotate3d(1,0,0,0); }
	100% { -webkit-transform: rotate3d(1,0,0,-90deg); }
	}
#presentation h3{ font-size: 22px; margin-bottom: 6px; color: #777; font-weight: 600;  }
#presentation p{ text-align: justify; font-size: 14px; font-weight: 400;  }




@media screen and (max-width: 800px){
	#te-wrapper img{ max-width: 740px; height:auto;}
	.te-container{ width:100%; padding:0px;}
	.te-wrapper{ width:100%;height:600px;}
	.te-cover, .te-transition{ width:100%;height:600px; }
	.te-cube-face{ width:100%;height:600px;  }
	#hab3 img, #hab4 img{display:none;}
	}

@media screen and (max-width: 700px){
	#hab2 img, #hab4 img{display:none;}
	#hab3 img{display: inline;}
	}


@media screen and (max-width: 500px){
	
	.te-container{ height:600px; padding:0px auto 00px auto;}
	.te-cover, .te-transition{ width:100%;  height:600px; }
	.te-cube-face{ width:100%;  height:600px; }
	#te-wrapper { width: 100%;  height:600px;}
	#te-wrapper img{max-width:440px; height:auto;}
	#hab2 img, #hab3 img{display:none;}
	#hab4 img{display: inline;}
	}