@font-face {
	font-family: DINPro;
	src: url(http://www.anima.co.mz/asset/DINPro Regular.otf);
}

*{
	margin: 0;
	padding: 0;
}

input{
	color: inherit;
	font: inherit;
}

body{
	font-family: DINPro, sans-serif;
	font-size: 14px;
	line-height: 1.8;
	background: url(../images/stripe_grey.png);
}

#container{
	position: absolute;
	left: 0px;
	top: 0px;
	bottom: 1px;
	right: 1px;
	cursor: default;
	overflow: hidden;

	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}

#content{
	background: url(../images/blurry_blobs.jpg);
    border: 1px solid rgba(0,0,0,0.4);
    
	-webkit-transform-origin: left top;
	-webkit-transform: translateZ(0);
	-moz-transform-origin: left top;
	-moz-transform: translateZ(0);
	-ms-transform-origin: left top;
	-ms-transform: translateZ(0);
	-o-transform-origin: left top;
	-o-transform: translateZ(0);
	transform-origin: left top;
	transform: translateZ(0);
}

#interact { width: 960px; height:600px; top: 7200px; left: 800px; display:block; overflow:scroll; position: absolute; border: 1px solid rgba(0,0,0,0.4); box-shadow: 0 0 15px rgba(0,0,0,0.8); text-align: center; }

button{
	padding: 6px 10px;
	margin-right: 1px;
}

#menudiv {
	position: absolute;
	display: block;
	left: 0px;
  	top: 16%;
  	z-index:100;
	font-family: DINPro, sans-serif;
	font-size: 1em; /*0.9em*/
	line-height: 2;
}

#logomenu {
	background: url(../images/logo-simple.png);
	background-repeat:no-repeat; 
	position:absolute;
	left:15px;
	top:25px;
	width: 30px;
	height: 30px;
	cursor:pointer;
	z-index:9999999;
}

.menu-item {
	position: absolute;
	background: #000000;
	color:#FFFFFF;	
	width:120px;
/* 	left:-220px; */
	text-align:right;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor:pointer;
	height: 30px;
}

.menu-text {
	/* position:relative;
	padding-left:50px;
	 top:10%; */
	 display: inline-block;
	 padding-right:10px;
	 height: 30px;
}

.cell {
	width: 960px;
	height:600px;
	position: absolute;
	text-align: center;
}


div.imageOverlay {
	position: absolute;
	top: 0px; 
	left: 0px;
	width:100%;
	height:100%;
	text-align: center;
    overflow: hidden;
	z-index: 2;
    background-color: #ffffff;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    opacity: 0.8;
    z-index: 3;
}

div.imageOverlay img { z-index: 1; }



#previous-button {
	position:absolute;
	top: 220px;
	right: 0px;
	width: 120px;
	height: 120px;
	background: url(../images/arrows-left.png);
	z-index: 4;
}

#next-button {
	position:absolute;
	top: 220px;
	width: 120px;
	height: 120px;
	background: url(../images/arrows-right.png);
	background-position: 0px 0px;
	z-index: 4;
}




/* ########## CELLS ########## */

#home { 	
	top: 7200px;
	left:4798px;
	background: url(../images/anima-logo_final_orig_noTP.png) no-repeat center;
}

#homeButtons { 	
	top: 7200px;
	left:5759px;
}

.homeDrawingButton { 	
	width: 140px;
	height: 40px;
	text-align: left;
	padding-left: 20px;
}

.buttonImgDrawing {
	display: block;
	height: 27px;
	width: 26px;	
}

#resetDrawingWrapper { 	
	position: absolute;
	top: 280px;
}

span.button-interact {
	display: block;
	height: 27px;
	width: 26px;
	cursor: pointer;
}

span.button-refresh {
	background: url(../images/button-interact-refresh.png) no-repeat;
}

.button-interact:hover {
	background-position: 0px -28px;
}

.button-label {
	display: none;
	position:absolute;
	color: #2fea9c;
	top: 0px;
	left:55px;
}


iframe {
	position: absolute;
	display: block;
	left: 0px;
  	top: 0px;
  	z-index:99;
	width: 200px;
	height:600px;
	filter:alpha(opacity=5); 
}

#people { 
	top: 9600px;
	left:6720px;
	background: url(../images/page-13.jpg) no-repeat;	
}

#portraitWrapper { 
	margin-top: 60px;
	margin-left:35px;
	text-align:left;	
}

#contacto{
	top: 10800px;
	left:6720px;
	
	font-family: DINPro, sans-serif;
	font-size: 1.4em;
	text-align:left;
	line-height:30px;
}

div.contacto-details{
	position: absolute;
	top: 200px; 
	left: 80px;
	width:400px;
}

div.contacto-icons{
	position: absolute;
	top: 140px; 
	right: 0px;
	width:480px;
	padding-top:200px;
}

div.icon-linkedin {
	position: absolute;
	top: 130px; 	
}

div.icon-twitter {
	position: absolute;
	top: 65px; 	
}

div.icon-facebook {
	position: absolute;
	top: 0px; 	
}

div.icon-skype {
	position: absolute;
	top: 195px;
	width: 190px; 	
}

span.social-link {
	display: block;
	height: 52px;
	width: 52px;
}

span.link-linkedin {
	background: url(../images/icon-linkedin.png) no-repeat;
}

.social-link:hover {
	background-position: 0px -51px;
}

span.link-twitter {
	background: url(../images/icon-twitter.png) no-repeat;
}

span.link-facebook {
	background: url(../images/icon-facebook.png) no-repeat;
}

span.link-skype {
	background: url(../images/icon-skype.png) no-repeat;
}

div.skypebutton {
	display: block;
	height: 52px;
	width: 52px;
}

div.skype-label {
	display: none;
	position:absolute;
	top: 10px;
	right:0px;
	color: #2fea9c;
}

#apres-page-1 { 
	top: 7200px;
	left:6720px;
}

#apres-page-2 { 
	top: 7200px;
	left:7681px;
	background: url(../images/page-02.jpg) no-repeat;
}

#apres-page-3 { 
	top: 7200px;
	left:8642px;
	background: url(../images/page-03.jpg) no-repeat;
}

#apres-page-4 { 
	top: 7200px;
	left:9603px;
	background: url(../images/page-04.jpg) no-repeat;
}

#apres-page-5 { 
	top: 7200px;
	left:10564px;
	background: url(../images/page-05.jpg) no-repeat;
}

#apres-page-6 { 
	top: 7200px;
	left:11525px;
	background: url(../images/page-12.jpg) no-repeat;
}


#estrutura-page-1 { 
	top: 8400px;
	left:6720px;
	background: url(../images/page-06.jpg) no-repeat;
}

#estrutura-page-2 { 
	top: 8400px;
	left:7681px;
	background: url(../images/page-07.jpg) no-repeat;
}

#estrutura-page-3 { 
	top: 8400px;
	left:8642px;
	background: url(../images/page-08.jpg) no-repeat;
}

#estrutura-page-4 { 
	top: 8400px;
	left:9603px;
	background: url(../images/page-09.jpg) no-repeat;
}

#estrutura-page-5 { 
	top: 8400px;
	left:10564px;
	background: url(../images/page-10.jpg) no-repeat;
}

#estrutura-page-6 { 
	top: 8400px;
	left:11525px;
	background: url(../images/page-11.jpg) no-repeat;
}

#estrutura-page-7 { 
	top: 8400px;
	left:12486px;
	background: url(../images/page-13.jpg) no-repeat;
}

#estrutura-page-8 { 
	top: 8400px;
	left:13447px;
	background: url(../images/page-14.jpg) no-repeat;
}

#estrutura-page-9 { 
	top: 8400px;
	left:14408px;
	background: url(../images/page-15.jpg) no-repeat;
}


