@charset "utf-8";
/* CSS Document */
.portfolio-catalogo{
	width: 100%;
	height: 75%;	
	position: relative;
	margin: 0 auto;
}
.boder-484748{
	border:3px solid #484748;
}


.portfolio-item{	
	height: 280px; 
	margin: auto; 			
	cursor: pointer;
}
.portfolio-button-plus{
	background:url(../images/bt-portfolio-plus.png) no-repeat;
	background-position:0 0;	
	width:50px;
	height:50px;
	position:absolute;
	right:10px;
	bottom:10px;
	z-index:20;
	cursor:pointer;
	border: 1px solid #ff0000;
}
.portfolio-button-plus:hover{
	background-position:-50px 0;
}
@media handheld, only screen and (max-width: 1000px) {
	.portfolio-left, .portfolio-center, .portfolio-right{
		width:auto;
		height:200px;
		position:relative;
		bottom:auto;
		padding:10px;
		margin:10px;
	}
	.boder-484748{
	}
	.portfolio-left{
		left:auto;
	}
	.portfolio-center{
		margin:10px;
		left:none;
		right:none;
	}
	.portfolio-right{
		right:auto;
	}
	.portfolio-item{
		position:absolute;
		top:10px;
		right:10px;
		bottom:10px;
		left:10px;	
	}
	.portfolio-button-plus{
	}
	.portfolio-button-plus:hover{
	}
}
#portfolio-header{
	height:600px;
	background:url(../images/bg-portfolio.jpg) no-repeat;
	background-size:cover;
}
#portfolio-header h1{
	width:auto;
	font-family:'Geomanist Bold';
	font-size:150px;
	font-weight:bold;
	text-align:center;
	color:#fff;
	opacity:.2;
	margin:0;
	padding:0;	
}
#portfolio-header p{
	font-family:'Geomanist Regular';
	width:60%;
	margin:20px auto;
	font-size:30px;
	color:#fff;
	position:absolute;
	right:100px;
	bottom:15%;	
}
#portfolio-header .portfolio-img{
	width:200px;
	height:200px;
	background:url(../images/img-portfolio.png) no-repeat center center;
	position:absolute;
	bottom:12%;
	left:60px;	
}
@media handheld, only screen and (max-width: 1000px) {
	#portfolio-header{
		height:500px;
	}
	#portfolio-header h1{
		font-size:60px;
		padding-top:20px;
	}
	#portfolio-header p{
		width:auto;
		margin:10px;
		font-size:14px;
		position:relative;
		right:auto;
		bottom:auto;
		text-align:center;	
	}
	#portfolio-header .portfolio-img{
		position:relative;
		bottom:auto;
		left:auto;
		margin:auto;
		margin-top:100px;
	}
}
#portfolio-identidadcorporativa, #portfolio-btl, #portfolio-mantenimientocorporativo{
	height:450px;
	background:url(../images/bg-graybar.jpg) no-repeat left top;
	background-size:cover;
}
#portfolio-publicidad, #portfolio-personaleventos, #portfolio-renders{
	height:450px;
	background:url(../images/bg-darkgraybar.jpg) no-repeat left top;
	background-size:cover;
}
#portfolio-identidadcorporativa h1, #portfolio-btl h1, #portfolio-mantenimientocorporativo h1, #portfolio-publicidad h1, #portfolio-personaleventos h1, #portfolio-renders h1{
	font-family:'Geomanist Black';
	font-size:45px;
	margin:20px;
}
@media handheld, only screen and (max-width: 1000px) {
	#portfolio-identidadcorporativa, #portfolio-btl, #portfolio-mantenimientocorporativo{
		height:800px;
	}
	#portfolio-publicidad, #portfolio-personaleventos, #portfolio-renders{
		height:800px;
	}
	#portfolio-identidadcorporativa h1, #portfolio-btl h1, #portfolio-mantenimientocorporativo h1, #portfolio-publicidad h1, #portfolio-personaleventos h1, #portfolio-renders h1{
		font-size:25px;
	}
}
.portfolio-show{
	background:url(../images/bg-black-50.png);
	width:80%;
	height:400px;
	position: absolute;
	top:0;
	right:0; 
	bottom:0;
	left:0;	
	margin:auto;
}
.portfolio-show .portfolio-img{
	display:none;
}
.portfolio-show .porfolio-show-frame{
	width:52%;	
	position:absolute;
	top:10px;	
	bottom:10px;
	left:10px;	
	border:3px solid #484748;
	padding:10px;
}
.portfolio-show .porfolio-show-img{
	width:100%;
	height:100%;
}
.portfolio-show .portfolio-show-content{
	width:40%;	
	position:absolute;
	top:10px;	
	bottom:10px;
	right:10px;	
	padding:10px;
}
.portfolio-show .portfolio-show-content .portfolio-show-content-img{
	background:url(../images/img-portfolio-item.png) no-repeat center center;
	width:125px;
	height:125px;
	margin:10px auto;
	margin-top:0;
}
.portfolio-show .portfolio-show-content .portfolio-show-content-info{
	background:#d1d2d4; 
	position:absolute;
	right:10px;
	left:10px;
	bottom:0;
	padding:10px;
}
.portfolio-show .portfolio-show-content .portfolio-show-content-info h1{
	font-family:'Geomanist Bold';
	font-size:20px;
	margin:5px 0;
}
.portfolio-show .portfolio-show-content .portfolio-show-content-info h2{
	font-family:'Geomanist Regular';
	font-size:20px;
	margin:5px 0;
	color:#ed1c24;
}
.portfolio-show .portfolio-show-content .portfolio-show-content-info p{
	font-family:'Geomanist Light';
	font-size:18px;
	margin:5px 0;	
}
@media handheld, only screen and (max-width: 1000px) {
	.portfolio-show{
		background:url(../images/bg-black-50.png);
		width:auto;
		height:auto;
		position:absolute;
		top:50px;;
		right:0; 
		bottom:0;
		left:0;	
		margin:auto;
	}
	.portfolio-show .portfolio-img{
		background:url(../images/img-portfolio-item-mobile.png) no-repeat center center;
		width:75px;
		height:75px;
		margin:20px auto;
		display:block;
	}
	.portfolio-show .porfolio-show-frame{
		width:auto;
		height:200px;
		position:absolute;
		top:0;	
		bottom:0;
		left:10px;
		right:10px;
		margin:auto;
	}
	.portfolio-show .porfolio-show-img{
	}
	.portfolio-show .portfolio-show-content{
		width:auto;	
		position:absolute;
		bottom:20px;
		right:0;
		left:0;
		margin:auto;
	}
	.portfolio-show .portfolio-show-content .portfolio-show-content-img{
		display:none;		
	}
	.portfolio-show .portfolio-show-content .portfolio-show-content-info{
	}
	.portfolio-show .portfolio-show-content .portfolio-show-content-info h1{
		font-size:16px;
	}
	.portfolio-show .portfolio-show-content .portfolio-show-content-info h2{
		font-size:16px;
	}
	.portfolio-show .portfolio-show-content .portfolio-show-content-info p{
		font-size:12px;
	}
}