@charset "utf-8";
/* Author: Danny Yataco */

header,nav,section,aside,article,figure,footer{
	display:block;
}

.cajatexto{
	font-family: 'Ubuntu Condensed', Arial, sans-serif;
	font-size:16px;
	color:#FFFFFF;
	text-align:justify;
}

h2{
	font-family: 'Oswald', Arial, sans-serif;
	font-size:24px;
	font-weight:bold;
	color:#F9C81E;
}

body{
	margin:0;
	background:url(../imagenes/cubitoclaro.jpg);
}

#contenedorquienessomos{
	width:920px;
	height:1220px;
	background-color:#1B1B1B;
	margin:0 auto;
	padding-top:10px;
}

#contenedorclientes{
	width:920px;
	height:1140px;
	background-color:#1B1B1B;
	margin:0 auto;
	padding-top:10px;
}

#contenedorservicios{
	width:920px;
	height:890px;
	background-color:#1B1B1B;
	margin:0 auto;
	padding-top:10px;
}

#contenedorlargo{
	width:920px;
	height:1130px;
	background-color:#1B1B1B;
	margin:0 auto;
	padding-top:10px;
}

#contenedorproyectos{
	width:920px;
	height:1440px;
	background-color:#1B1B1B;
	margin:0 auto;
	padding-top:10px;
}

#contenedorlanding{
	width:920px;
	height:1440px;
	background-color:#1B1B1B;
	margin:0 auto;
	padding-top:10px;
}

#pie{
	width:100%;
	height:85px;
	background:#F9C81E;
	margin:0 auto;
	padding-top:10px;
}

#cabecera{
	width:100%;
	height:140px;
	margin:0 auto;
}



#logo-ana{
	width:200px;
	height:120px;
	margin:0 auto;
}

#logo-ana ul{
	margin:0;
	padding:0;
	list-style:none;
}

#logo-ana a.ana{
	width:200px;
	height:120px;
	display:block;
	background:url(../imagenes/mq.png);
	text-indent:-8000px;
	padding:0;
}

#banner{
	width:920px;
	height:295px;
	margin:0 auto;
	margin-top:20px;
	display:block;
	padding:0;
}

#titulo{
	width:840px;
	height:40px;
	margin:0 auto;
	margin-top:30px;
	display:block;
	padding:0;
}

#cajita{
	width:212px;
	height:240px;
	margin:15px 10px 10px 56px;
	float:left;
	padding:10px 0 0 10px;
	display:inline;
	background-color:#F2F2F2;
}

#img-clientes{
	width:846px;
	height:500px;
	margin:15px 10px 10px 40px;
	display:block;
	background-color:#3F0;
}


#proyecto-imagen{
	width:203px;
	height:180px;
	background-color:#CC3;
	margin-bottom:15px;
	display:block;
}

#imagenzoom{
	width:203px;
	height:227px;
	background-color:#330;
	display:block;
}

#boton{
	width:130px;
	height:30px;
	margin:0 auto;
}

#boton ul{
	margin:0;
	padding:0;
	list-style:none;
}

#boton li a.verproyecto{
	width:130px;
	height:30px;
	display:block;
	background:url(../imagenes/boton-proyecto.png);
	text-indent:-8000px;
}


#boton li a.verproyecto:hover{
	background-position:-130px;
}

#boton li a.verobra{
	width:130px;
	height:30px;
	display:block;
	background:url(../imagenes/boton-obra.png);
	text-indent:-8000px;
}


#boton li a.verobra:hover{
	background-position:-130px;
}

#caja{
	width:840px;
	height:250px;
	margin:0 auto;
	margin-top:10px;
	margin-bottom:70px;
	display:block;
	padding-top:20px;
}

#caja-texto{
	width:500px;
	height:220px;
	margin:0 auto;
	float:left;
	display:block;
	padding:0;
}

#caja-imagen{
	width:270px;
	height:200px;
	margin:0 auto;
	float:right;
	display:block;
	padding:0;
}

#fotosgrandes{
	display:none;
}


#caja-pie{
	width:880px;
	height:80px;
	margin:0 auto;
	display:block;
	padding:0;
}

#pie-izq{
	width:450px;
	height:80px;
	margin:0 auto;
	display:block;
	padding:0;
	float:left;
}

#pie-der{
	width:190px;
	height:70px;
	margin:0 auto;
	display:block;
	float:right;
}

#pie-der ul{
	margin:0;
	padding:0;
	list-style:none;
}

#pie-der li a{
	width:190px;
	height:70px;
	text-indent:-8000px;
	display:block;
	background:url(../imagenes/boton-brochure.png);
}

#pie-der li a:hover{
	background-position:-190px;
}

#logos-empresas{
	width:852px;
	height:500px;
	display:block;
	margin:0 auto;
}

#empresas{
	width:150px;
	height:130px;
	margin:10px;
	display:inline;
	float:left;
}


#texto-proyectos{
	width:840px;
	height:120px;
	margin:0 auto;
}

#proyecto-visor{
	width:852px;
	height:330px;
	display:block;
	margin:0 auto;
}

#celulares{
	display:none;
}

@media only screen and (max-width: 800px){

#contenedorlanding{
	width:780px;
	height:1950px;
}

#img-clientes{
	width:700px;
	height:410px;
}

#contenedorclientes{
	width:780px;
	height:1000px;
}

#cajita{
	margin:15px 10px 10px 110px;
}

#contenedorquienessomos{
	width:780px;
	height:1600px;
	margin:0 auto;
	padding:0;
}

#contenedorservicios{
	width:780px;
	height:1500px;
	margin:0 auto;
	padding:0;
}

#contenedorproyectos{
	width:780px;
	height:1700px;
	margin:0 auto;
	padding:0;
}

#pie{
	width:780px;
}


#banner{
	width:760px;
	height:260px;
}

#titulo{
	width:780px;
	height:40px;
	text-align:center;
}

#caja{
	width:100%;
	height:500px;
	margin-bottom:20px;
}


#caja-texto{
	float:none;
	margin-bottom:20px;
}

#caja-imagen{
	float:none;
}

#caja-pie{
	width:700px;
}

#empresas{
	width:120px;
	height:104px;
}

#texto-proyectos{
	width:680px;
	height:120px;
	margin:0 auto;
}

#logos-empresas{
	width:710px;
	height:400px;
}

#proyecto-visor{
	display:none;
}

#fotosgrandes{
	display:block;
	width:85%;
	margin: 0 auto;
}

}


@media only screen and (max-width: 720px){

#contenedorlanding{
	width:700px;
	height:1950px;
}

#img-clientes{
	width:620px;
	height:365px;
}

#contenedorclientes{
	width:700px;
	height:930px;
}

#cajita{
	margin:15px 10px 10px 80px;
}

#contenedorquienessomos{
	width:700px;
	margin:0 auto;
	padding:0;
}

#contenedorservicios{
	width:700px;
	margin:0 auto;
	padding:0;
}

#contenedorlargo{
	width:700px;
	margin:0 auto;
	padding:0;
}

#contenedorproyectos{
	width:700px;
	height:1650px;
}

#logos-empresas{
	width:570px;
	height:500px;
}

#titulo{
	width:680px;
}

#pie-der{
	display:none;
}


#pie{
	width:100%;
	height:200px;
}

#banner{
	width:680px;
	height:240px;
}

#texto-proyectos{
	width:640px;
	height:120px;
	margin:0 auto;
}


#caja-pie{
	width:680px;
	height:170px;
}

#pie-izq{
	width:450px;
	height:100px;
	text-align:center;
	padding:0;
	float:none;
}



#celulares{
	width:197px;
	height:70px;
	margin:0 auto;
	display:block;
}

#celulares ul{
	margin:0;
	padding:0;
	list-style:none;
}

#celulares li a.ana{
	width:197px;
	height:68px;
	background:url(../imagenes/cel-ana.png);
	text-indent:-8000px;
	display:block;
}


}


@media only screen and (max-width: 640px){

#contenedorlanding{
	width:580px;
	height:1850px;
}

#img-clientes{
	width:500px;
	height:296px;
}

#contenedorclientes{
	width:580px;
	height:850px;
}

#cajita{
	margin:15px 10px 10px 30px;
}

#contenedorquienessomos{
	width:580px;
	height:1520px;
	margin:0 auto;
	padding:0;
}

#contenedorservicios{
	width:580px;
	margin:0 auto;
	padding:0;
}


#contenedorproyectos{
	width:580px;
	height:1600px;
}

#pie{
	width:100%;
}

#titulo{
	width:580px;
}

#caja{
	width:580px;
}

#banner{
	width:580px;
	height:190px;
}

#caja-pie{
	width:100%;
}



#contenedorlargo{
	width:580px;
}

#texto-proyectos{
	width:540px;
}

}


@media only screen and (max-width: 540px){

#contenedorlanding{
	width:100%;
	height:2900px;
}

#img-clientes{
	width:430px;
	height:225px;
}

#contenedorclientes{
	width:100%;
	height:700px;
}

#cajita{
	margin:0 auto;
	margin-bottom:20px;
	margin-top:15px;
	float:none;
	display:block;
}

#contenedorquienessomos{
	width:100%;
	height:1470px;
}

#contenedorservicios{
	width:100%;
	height:950px;
	margin:0 auto;
	padding:0;
}

#contenedorproyectos{
	width:100%;
	height:2600px;
}

#contenedorlargo{
	width:460px;
}

#pie{
	width:100%;
}

#titulo{
	width:460px;
}

#banner{
	width:440px;
	height:150px;
}

#texto-proyectos{
	width:400px;
}


#logos-empresas{
	width:430px;
	height:630px;
}

#caja{
	width:450px;
	height:480px;
}

#caja-texto{
	width:410px;
	height:220px;
}


}


@media only screen and (max-width: 500px){

#caja-pie{
	width:350px;
}

#pie-izq{
	width:300px;
	height:100px;
	text-align:center;
	padding:0;
	float:none;
}

#img-clientes{
	width:320px;
	height:190px;
}

#pie{
	width:100%;
}

#titulo{
	width:100%;
}

#banner{
	width:360px;
	height:120px;
}

#caja-texto{
	width:300px;
	height:270px;
}

#caja{
	width:100%;
	height:520px;
}

#contenedorquienessomos{
	height:1500px;
}

#celulares{
	margin:0 auto;
	margin-top:20px;
}

}