@charset "utf-8";
/* CSS Document */

body{ 	
	height: 100%;
	padding: 0;
	font-size:14px;	
	text-align:left;
	margin:0px;
	position:relative;				
	background: #333;
	font-family: 'Open Sans', sans-serif;
	font-weight:400;
	color:#000;
	min-width:320px;
	}	

html{
	height: 100%;
	padding: 0;
	}		
	
img{ 
	border:none;
	vertical-align:middle;
	}
	
.sb_hubyx{
	font-family: 'Open Sans', sans-serif;
	}

.tablaMain{
	width:100%;
	height:100%;	
	}
	
a{
	outline: 0;
}

.transition{	
	transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;
	}
	
/*HEADER*/

header{
	height:40px;
	position:fixed;
	width:100%;
	left:0px;
	top:0px;
	z-index:999;
	}
	
.ajusteHeader{
	height:40px;
	}
	
.menuBtn{
	font-size:1em;
	font-weight:600;
	display:inline-block;
	box-sizing:border-box;
	
	height:40px;
	line-height:40px;	
	vertical-align:middle;	
	
	background:rgba(255,255,255,1.00);
	padding-left:15px;
	padding-right:15px;
	
	cursor:pointer;
	
	transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;
	}
	
.menuBtn img{
	height:15px;
	margin-left:5px;
	margin-top:-3px;
	}
	
.menuBtn:hover{
	background:rgba(255,255,255,0.2);
}
	
.rollOver{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1;
	
	transition: all 0.2s;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
}

.rollOver:hover{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	-khtml-opacity: 0.6;
	opacity: 0.6;
	background:none;
}


/*FOOT*/

.foot{
	height:10px;
	vertical-align:middle;
	color:rgba(255,255,255,.50);
	font-size:.9em;
	padding:20px;
	}	
	
.linkFoot{
	color:rgba(255,255,255,.50);
	text-decoration:none;
	}

/*HOME*/

.intro{
	font-family:Arial;
	font-weight:600;
	color:#333;
	font-size:125px;
	text-align:left;
	display:inline-block;
	margin-left:28%;
	margin-top:-50px;
	letter-spacing:-10px;
	line-height:98px;
	box-sizing:border-box;
	
	}

.logoHome{
	width:400px;
	position:absolute;
	bottom:100px;
	right:100px;
	display:inline-block;
	box-sizing:border-box;
	}
	
.logoHome img{
	width:100%;	
	}
	
.noPadding{
	padding:0px !important;	
	}	
	
/*NOSOTROS*/

.textoBig{
	color:#FFFFFF;
	display:inline-block;
	margin-left:150px;
	width:100%;
	max-width:500px;
	font-size:25px;
	line-height:28px;
	letter-spacing:-1px;
	}
	
.textoBig .logo{
	width:100%;
	margin-bottom:40px;	
	}
	
	
/*CONTENIDO*/

.contenidoPad{
	padding:40px;	
	}
	
/*SERVICIOS*/

.tablaServicios{
	width:100%;
	}
	
.tablaServicios td{
	vertical-align:top;
	}
	
.tablaServicios .titulo{
	background:#249bc5;	
	padding:20px 0px;
	font-size:45px;
	text-align:center;
	color:#FFF;
	font-family:Arial;
	font-weight:600;
	letter-spacing:-4px;
	}
	
.tablaServicios td:nth-child(odd){
	background:#333;
	color:#FFF;	
	}
	
.tablaServicios td:nth-child(even){
	background:#e7e7e8;	
	color:#333;
	}
	
.tablaServicios .texto{
	padding:40px;	
	}
	
/*CATEGORIAS*/	

.catRow{
	width:25%;
	display:inline-block;
	box-sizing:border-box;
	float:left;
	padding:40px;	
	}
	
.catThumb{
	display:inline-block;
	width:100%;
	box-sizing:border-box;
	-webkit-border-radius: 20px;
	border-radius: 20px;
	background:#333;
	height:200px;
	text-align:center;
	
	-webkit-transform-style: preserve-3d;
  	-moz-transform-style: preserve-3d;
  	transform-style: preserve-3d;
	
	color:#FFF;
	
	text-decoration:none;
	
	transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;
	}
	
.catThumb:hover{
	background:rgba(0,0,0,1.00);
	
	}
	
	
.catThumb .texto{
	position: relative;
  	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	}
	
.catThumb .titulo{	
	font-size:45px;
	color:#249bc5;
	font-family:Arial;
	font-weight:600;
	letter-spacing:-4px;
	}
	
		
.clientes{
	display:inline-block;
	box-sizing:border-box;
	float:left;
	text-align:center;
	width:100%;
	background:#333;	
	}
	
.cliente{
	width:80px;
	height:80px;
	box-sizing:border-box;
	margin:20px 20px 0px 20px;
	display:inline-block;	
	text-align:center;
	
	
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	-khtml-opacity: 0.6;
	opacity: 0.6;
	background:none;
	}
	
.cliente img{	
	max-height:80px;
	max-width:80px;
	}
	

.clienteSmall{
	width:80px;
	height:50px;
	}	
	
.clienteSmall img{
	max-height:50px;
	max-width:50px;
	}
	
.clientes .titulo{	
	font-size:45px;
	color:#249bc5;
	font-family:Arial;
	font-weight:600;
	letter-spacing:-4px;
	margin-top:40px;
	margin-bottom:20px;
	}
	
/*LISTADO*/

.listado{
	background:#333;
	display:inline-block;
	width:100%;
	padding:20px;
	box-sizing:border-box;
	}

.listado .thumb{
	display:inline-block;
	box-sizing:border-box;
	float:left;
	width:25%;
	position:relative;
	padding:20px;	
	}
	
.listado .thumb .inner{
	width:100%;
	display:inline-block;
	position:relative;
	box-sizing:border-box;
	cursor:pointer;
	text-decoration:none;
	}
	
.listado .thumb .inner img{
	width:100%;
	border:#FFF solid 5px;
	box-sizing:border-box;
	display:inline-block;	
	
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	
	transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;
	}
	
.listado .thumb .inner:hover img{
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);	
	}
	
.listado .thumb .caption{
	text-align:right;
	display:inline-block;
	box-sizing:border-box;
	width:100%;
	color:rgba(255,255,255,.4);
	
	text-align:center;
	padding:5px;
		
	font-size:.8em;
	text-align:right;
	
	max-height:26px;
	overflow:hidden;
	}
	
.bloque{
	margin-top:200px;	
	}
	
	
.tituloBig{
	font-family:Arial;
	font-weight:600;
	color:#333;
	font-size:125px;
	text-align:left;
	display:inline-block;
	letter-spacing:-10px;
	line-height:98px;
	box-sizing:border-box;
	margin-bottom:30px;
	margin-left:40px;
	}
	

/*FICHA*/

.bloqueFicha{
	display:inline-block;
	box-sizing:border-box;
	background:#000 url(../img/wallpapers/cubo.png);
	background-repeat:no-repeat;
	background-position:center top;
	padding:40px;
	width:100%;
	}

.tablaFicha{
	width:100%;	
	}
	
.tablaFicha .left{
	width:40%;
	vertical-align:top;
	padding-right:40px;
	text-align:right;
	position:relative;
	}
	
.tablaFicha .right{
	width:60%;	
	vertical-align:top;
	padding-left:40px;
	}

.galeria{
	width:100%;
	display:inline-block;
	box-sizing:border-box;
	border:#333 solid 5px;
	cursor:pointer;
	}
	
.galeria img{
	width:100%;	
	}

.ficha{
	font-size:1.2em;	
	float:right;
	}	

.ficha .titulo{
	font-weight:600;
	font-size:25px;
	color:#249bc5;
	letter-spacing:-1px;
	line-height:25px;	
	}
	
.ficha .year{
	color:rgba(255,255,255,.5);
	}		
	
.ficha .desc{
	color:rgba(255,255,255,1.0);
	margin-top:15px;
	max-width:480px;
	}	
	
.ficha .linkFicha{
	color:rgba(255,255,255,.5);
	margin-top:15px;
	text-decoration:none;
	display:inline-block;
	
	transition: all 0.2s;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
	}
	
.ficha .linkFicha:hover{
	color:rgba(255,255,255,.9);
	}
	
.logoFicha{
	position:absolute;
	bottom:0px;
	right:40px;
	height:45px;
	
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
	filter: alpha(opacity=10);
	-moz-opacity: .1;
	-khtml-opacity: .1;
	opacity: .1;
	}
    
    #canvas{
        position: absolute;
        left: 0px;
        top: 0px;
    }

/*MEDIA QUERIES*/

@media (max-width:1625px){
	.logoHome{
		right:50px;
		bottom:50px;
		width:350px;
	}
	
	.intro{
		font-size:100px;
		line-height:80px;
	}
}


@media (max-width:1340px){
	.catRow{
	width:25%;
	display:inline-block;
	box-sizing:border-box;
	float:left;
	padding:20px;	
	}
	
	/*LISTADO*/
	
	.bloque{
		margin-top:160px;	
	}
	
	.listado .thumb{
		width:33%;
	}
	
	.tituloBig{
		font-size:110px;	
		letter-spacing:-9px;	
	}
	
}

@media (max-width:1230px){
	.logoHome{
		width:250px;
	}
	
	.intro{
		font-size:80px;
		line-height:65px;
		letter-spacing:-8px;
	}
}

@media (max-width:1200px){
	.tablaServicios .texto{
		padding:20px;	
	}
}

@media (max-width:1150px){

	/*FICHA*/
	.bloqueFicha{
		padding:20px;
	}	
	
	.ficha .titulo{
	font-size:22px;	
	line-height:20px;
	}
	
	.ficha{
	font-size:1.0em;
	}	
	
	.tablaFicha .left{
	padding-right:20px;
	}
	
	.tablaFicha .right{
	padding-left:20px;
	}
	
	.logoFicha{
		right:20px;
	}
}

@media (max-width:1150px)and (min-width:645px){
	.catRow{
	width:50%;
	padding:40px;	
	}
}

@media (max-width:960px) and (min-width:844px{	
	.logoHome{
		width:230px;
	}

	.intro{
		margin-left:25%;
	}
}