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

*{
	
	margin:0px;
	padding:0px;	
	}
	
	body{
		background:#003366;
		
		}
	
	
	
	#contenido-principal{
		width:80%;
		background-color:rgba(191,191,191,1.00);
		margin:0px auto;
		padding:0px;
		
		}	
	
	
	#header {
		width:100% auto;
		background:rgba(0,0,0,1.00);
		float:none;
		text-align:center;

		
		}
		
	#header img{
		width:100%
		}	
		
	/* menu bar */
		
	#menubar {
		width:100%;
		height:40px;
		float:left;
		text-align:center;
		font-family:"Helvetica Neue", "Helvetica Neue Light";
		
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4c4c4c+0,595959+10,111111+73,131313+100 */
background: #4c4c4c; /* Old browsers */
background: -moz-linear-gradient(top, #4c4c4c 0%, #595959 10%, #111111 73%, #131313 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4c4c4c), color-stop(10%,#595959), color-stop(73%,#111111), color-stop(100%,#131313)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #4c4c4c 0%,#595959 10%,#111111 73%,#131313 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #4c4c4c 0%,#595959 10%,#111111 73%,#131313 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #4c4c4c 0%,#595959 10%,#111111 73%,#131313 100%); /* IE10+ */
background: linear-gradient(to bottom, #4c4c4c 0%,#595959 10%,#111111 73%,#131313 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 ); /* IE6-9 */
copy

		
		
		}
		
	#menubar nav{
		
		z-index:1000px;
		max-height:1000;
		width:100%;
		padding:0px;
		margin:0px auto;
		font-size:12px;
	
		}
			
	#menubar nav ul{
		list-style:none;
			}
			
			
	#menubar nav ul li{
		width:100px;
		height:40px;
		display:inline-block;
		position:relative;
		text-align:center
		}		
	#menubar nav ul li:hover{
		
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#002672+0,23195b+53,131313+100&1+0,0.01+100 */
background: -moz-linear-gradient(top, rgba(0,38,114,1) 0%, rgba(35,25,91,0.48) 53%, rgba(19,19,19,0.01) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,38,114,1)), color-stop(53%,rgba(35,25,91,0.48)), color-stop(100%,rgba(19,19,19,0.01))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(0,38,114,1) 0%,rgba(35,25,91,0.48) 53%,rgba(19,19,19,0.01) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(0,38,114,1) 0%,rgba(35,25,91,0.48) 53%,rgba(19,19,19,0.01) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(0,38,114,1) 0%,rgba(35,25,91,0.48) 53%,rgba(19,19,19,0.01) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(0,38,114,1) 0%,rgba(35,25,91,0.48) 53%,rgba(19,19,19,0.01) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#002672', endColorstr='#03131313',GradientType=0 ); /* IE6-9 */
		
		
		
		
		
		}	
		
	#menubar nav ul li:hover a{
		color:rgba(0,155,255,1.00)
		}	
		
	#menubar nav ul li a {
		color:rgba(223,223,223,1.00);
		display:inline-block;
		text-decoration:none;
		padding:10px;
		}
		
		
	/*menu bar 2*/	
		
	#leftmenu {
		width:15%;
		height:550px;
		background:rgba(240,240,240,1.00);
		float:left;
		
		}
		
	#menubar2 {
		color:rgba(172,172,172,1.00);
		width:100%;
		height:50px;
		float:left;
		text-align:center;
		font-family:"Helvetica Neue", "Helvetica Neue Light";
		
		
		}	
		
	#menubar2 nav {
		z-index:1000px;
		max-height:1000;
		width:100%;
		padding:0px;
		margin:0px auto;
		font-size:12px;
		
		}	
		
	#menubar2 nav ul{
		list-style:none;
		
		
		}
		
	#menubar2 nav ul li{
		width:100%;
		position:relative;
		text-align:left;
		
		}
		
	#menubar2 nav ul li:hover{
		width:100%;
		background:rgba(28,44,95,1.00);
		
		}	
		#menubar2 nav ul li:hover a{
			
		color:rgba(255,255,255,1.00)
		}
		
	#menubar2 nav ul li a {
		color:rgba(75,75,75,1.00);
		display:inline-block;
		text-decoration:none;
		padding:12px;
		
		}
	
	/*contenido*/
	.espacio{
		width:85%;
		height:50px;
		padding:0px;
		background:#FFFFFF;
		color:#003366;
		text-align:center;
		float:left;
		font-size:40px;
		font-family:"Helvetica Neue", "Helvetica Neue Light"
		
		
		}	
		
	#contenido {
		width:85%;
		height:550px;
		background:rgba(213,213,213,1.00);
		float:left;
		display:block;
		}
		
		#contenido-productos {
		width:85%;
		height:750px;
		background:rgba(213,213,213,1.00);
		float:left;
		display:block;
		}
		
		
		
	#contenido_proyecto
	 {
		width:85%;
		height:320px;
		background:rgba(213,213,213,1.00);
		float:left;
		display:block;
		}
	
	#contenido_proyecto2
	 {
		width:85%;
		height:320px;
		background:rgba(213,213,213,1.00);
		float:left;
		display:block;
		}
	
	#contenido_proyecto3
	 {
		width:85%;
		height:320px;
		background:rgba(213,213,213,1.00);
		float:right;
		display:block;
		}
		
		#contenido_empresas
	 {
		width:85%;
		height:620px;
		background:rgba(213,213,213,1.00);
		float:left;
		display:inline-block;
		}
		
		#contenido_arq{
		width:85%;
		height:620px;
		background:rgba(213,213,213,1.00);
		float:left;
		display:inline-block;
		}
		
		#contenido_pla{
		width:85%;
		height:170%;
		background:#FFFFFF;
		float:left;
		text-justify:inter-cluster;
		display:inline-block;
		}
		
	.elemento1{
		width:32.5%;
		height:100%;
		float:left;
		}
		
	.elemento1_arq{
		width:32.5%;
		height:100%;
		float:left;
		}
		
	.elemento_empresas{
		width:80;
		height:100%;
		float:left;
		}
		
	.elemento_arq{
		width:20;
		height:100%;
		float:left;
		}
		
	.elemento-pla{
		margin:5%;
		padding:5%;
		width:80%;
		height:170%;
		display:inline-block;
		color:hsla(210,83%,21%,1.00);
		text-align:justify;
		font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
		}
		
	.fotografia img{
		width:80%;
		margin:20px;
		padding:10px;
		border:1px solid rgba(79,79,79,.50);
		}
		
		.fotografia_arq img{
		width:45%;
		margin:1px;
		padding:1px;
		border:1px solid rgba(79,79,79,.50);
		}
		
		
	.fotografia_pla img{
		width:20%;
		margin:5px;
		padding:5px;
		border:1px solid rgba(79,79,79,.50);
		}
		
	.fotografia_empresas img{
		width:12%;
		margin:30px;
		padding:30px;
		float:left;
		display:block;
		border:1px solid rgba(79,79,79,.50);
		}

	.fotografia_arq img{
		width:45%;
		margin:2px;
		padding:2px;
		float:left;
		display:block;
		border:1px solid rgba(79,79,79,.50);
		}



	.elemento2{
		color:rgba(37,66,96,1.00);
		width:67.5%;
		height:100%;
		float:left;
		;
		}
		
		.texto-plafones{
			padding:10px;
			width:100%;
			float:left;
			width:98.2%;
			position:relative;
			height:700px;
			display:inline-block;
			background:hsla(0,0%,100%,1.00);
			}
			
		.grupo{
			margin:0px;
			width:49%;
			height:220px;
			top:0px;
			position:relative;
			display:block;
			float:left;
			font-size:12px;
			background:hsla(0,0%,93%,.20);
			color:hsla(0,0%,50%,1.00);
			font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
			}
			
			
		.pto-1{
			margin:0px;
			padding:0px;
			width:30%;
			float:left;
			display:block;
			border:1px solid hsla(0,0%,33%,1.00);
			}
			
			.pto-1 img{
				width:100%;
				width:100%;
				}
			
			
			
			
		.texto-1{
			margin:5px;
			padding:5px;
			width:57%;
			height:80%;
			float:left;
			display:block;
			
			
			}
	.image-row{
		width:105%
		}	
	.image-set a{
		margin:5px;
		padding:0px;
		width:10%
		}		
		
	.texto{
		margin:0px;
		padding:0px;
		width:50%;
		color:hsla(210,100%,20%,1.00);
		font-size:10px;
		text-align:center;
		float:none;
		font-family:"Helvetica Neue", "Helvetica Neue Light";
		
		}

	/* prmocionales*/	

	#categorias{
		display:inline-block;
		float:left;
		width:100%;
		background:rgba(231,231,231,1.00);
		
		
		
		}
		
		
	
		
		
		
		#categorias img{
		width:25%;
		height:100%;
	    float:left;
		
		
		}	
		
		
		
		
	#footer {
		color:rgba(42,42,42,1.00);
		height:50px;
		background:rgba(159,159,159,1.00);
		margin:0px;
		padding:10px;
		text-align:center;
		font-family:"Helvetica Neue", "Helvetica Neue Light";
		font-size:12px;
		float:none;
		clear:both;
		}					
		
		
		
		
 @media screen and ( max-width: 768px ){ 
 
 .image-row{
		width:100%
		}	
 
 
 #menubar nav{
		
		z-index:1000px;
		max-height:1000;
		width:100.4%;
		padding:0px;
		margin:0px auto;
		font-size:12px;
	
		}
.texto{
		margin:20px;
		padding:0px;
		font-size:5px;
		text-align:left;
		float:left;
		font-family:"Helvetica Neue", "Helvetica Neue Light";
		
		}



	#leftmenu {
		width:15%;
		height:400px;
		float:left;
		
		
		}
		
	#menubar2 {
		color:rgba(172,172,172,1.00);
		width:100%;
		height:100px;
		float:left;
		text-align:center;
		font-family:"Helvetica Neue", "Helvetica Neue Light";
		
		
		}	
		

	#menubar2 nav {
		z-index:1000px;
		max-height:1000;
		width:100%;
		padding:0px;
		margin:0px auto;
		font-size:9px;
		
		
		}
	
		
	#menubar2 nav ul{
		list-style:none;
		
		
		}
		
	#menubar2 nav ul li{
		width:100%;
		position:relative;
		text-align:left;
		
		}
		
	#menubar2 nav ul li:hover{
		width:100%;
		background:rgba(28,44,95,1.00);
		
		}	
		#menubar2 nav ul li:hover a{
			
		color:rgba(255,255,255,1.00)
		}
		
	#menubar2 nav ul li a {
		color:rgba(75,75,75,1.00);
		display:inline-block;
		text-decoration:none;
		padding:2px;
		
		}
	
	/*contenido*/
	.espacio{
		
		height:50px;
		background:rgba(255,255,255,1.00);
		
		
		}	
		
	#contenido {
		width:85%;
		height:400px;
		background:rgba(213,213,213,1.00);
		float:left;
		display:block;
		}
		
	#contenido2 {
		width:85%;
		height:400px;
		background:rgba(213,213,213,1.00);
		float:left;
		display:block;
		}
		
	.elemento1{
		width:32.5%;
		height:100%;
		float:left;
		}
	.fotografia img{
		width:85%;
		margin:20px;
		padding:5px;
		border:1px solid rgba(79,79,79,.50);
		}



	.elemento2{
		color:rgba(37,66,96,1.00);
		width:67.5%;
		height:100%;
		float:left;
		;
		}

	#categorias img{
		width:24%;
		height:100%;
	    float:left;
	
		
 }
 
 
  @media screen and ( max-width: 480px ){
	 .image-set a{
		margin:10px;
		padding:0px;
		width:40%
		}	
		
	 
	  #contenido-productos {
		width:100%;
		height:100%;
		background:rgba(213,213,213,1.00);
		float:left;
		display:block;
		}
	  
	  .grupo{
			margin:0px;
			width:100%;
			height:150px;
			top:0px;
			position:relative;
			display:block;
			float:left;
			font-size:10px;
			
			color:hsla(0,0%,50%,1.00);
			font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
			}
			
			
		.pto-1{
			margin:0px;
			padding:0px;
			width:20%;
			float:left;
			display:block;
			border:1px solid hsla(0,0%,33%,1.00);
			}
			
			.pto-1 img{
				width:100%;
				width:100%;
				}
			
			
			
			
		.texto-1{
			margin:5px;
			padding:5px;
			width:57%;
			height:80%;
			float:left;
			display:block;
			
			
			}
	  
	  
	  
	  
	 
	  #contenido-principal{
		width:100%;
		background-color:rgba(191,191,191,1.00);
		margin:0px auto;
		padding:0px;
		
		}	
	  
	  
	  .image-row{
		  	
			padding:0px;
			margin:0px;
			background:hsla(0,0%,93%,1.00);
			}
		
		.image-set{
			
			padding:10px;
			margin:0px;
			background:hsla(0,0%,93%,1.00);
			}
	  
	  
	  
	  .espacio{
		width:100%;
		height:40px;
		padding:0px;
		background:rgba(255,255,255,1.00);
		color:rgba(2,101,219,1.00);
		text-align:center;
		float:left;
		font-size:30px;
	  }
	  #menubar {
		width:30%;
		height:210px;
		float:left;
		text-align:center;
		font-family:"Helvetica Neue", "Helvetica Neue Light";
		
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4c4c4c+0,595959+10,111111+73,131313+100 */
background: #4c4c4c; /* Old browsers */
background: -moz-linear-gradient(top, #4c4c4c 0%, #595959 10%, #111111 73%, #131313 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4c4c4c), color-stop(10%,#595959), color-stop(73%,#111111), color-stop(100%,#131313)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #4c4c4c 0%,#595959 10%,#111111 73%,#131313 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #4c4c4c 0%,#595959 10%,#111111 73%,#131313 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #4c4c4c 0%,#595959 10%,#111111 73%,#131313 100%); /* IE10+ */
background: linear-gradient(to bottom, #4c4c4c 0%,#595959 10%,#111111 73%,#131313 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 ); /* IE6-9 */
copy

		
		
		}
		
		#menubar2 {
		width:233%;
		height:210px;
		float:left;
		background:hsla(0,0%,94%,1.00);
		text-align:center;}
		
		
		
		#leftmenu {
		width:30%;
		height:210px;
		float:left;
		text-align:center;
		font-family:"Helvetica Neue", "Helvetica Neue Light";
		
		}
		
		.texto{
		margin:20px;
		padding:0px;
		font-size:4.5px;
		text-align:left;
		float:left;
		font-family:"Helvetica Neue", "Helvetica Neue Light";
		
		}
	
	
		
		
		
		
		
		
	#menubar nav{
		padding:0px;
		margin:0px auto;
		font-size:13px;
	
		}
		
	#leftmenu{
		padding:0px;
		margin:0px auto;
		float:left;
		font-size:12px;
		}	
		
			
	#menubar nav ul{
		list-style:none;
			}
		
	#leftmenu nav ul{
	list-style:none;	}
	
	
			
	#menubar nav ul li{
		width:100%;
		height:30px;
		position:relative;
		text-align:center
		}		
		
	#leftmenu nav ul li{
		width:100%;
		height:30px;
		
		position:relative;
		text-align:center
		}		
		
		
	#menubar nav ul li:hover{
		
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#002672+0,23195b+53,131313+100&1+0,0.01+100 */
background: -moz-linear-gradient(top, rgba(0,38,114,1) 0%, rgba(35,25,91,0.48) 53%, rgba(19,19,19,0.01) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,38,114,1)), color-stop(53%,rgba(35,25,91,0.48)), color-stop(100%,rgba(19,19,19,0.01))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(0,38,114,1) 0%,rgba(35,25,91,0.48) 53%,rgba(19,19,19,0.01) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(0,38,114,1) 0%,rgba(35,25,91,0.48) 53%,rgba(19,19,19,0.01) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(0,38,114,1) 0%,rgba(35,25,91,0.48) 53%,rgba(19,19,19,0.01) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(0,38,114,1) 0%,rgba(35,25,91,0.48) 53%,rgba(19,19,19,0.01) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#002672', endColorstr='#03131313',GradientType=0 ); /* IE6-9 */
		
		
		
		
		
		}	
		
	#menubar nav ul li:hover a{
		color:#FFFFFF;
		}	
		
	#menubar nav ul li a {
		color:rgba(223,223,223,1.00);
		display:inline-block;
		text-decoration:none;
		padding:10px;
		}
		
		#contenido_pla{
			width:100%;
			}
		
		#leftmenu nav ul li a{
			width:100%;
			height:100%;
			font-size:10px;
			color:rgba(75,75,75,1.00);
			display:inline-block;
			
			text-decoration:none;
			padding:0px;
			}
		#leftmenu nav ul li{
			width:45%;
			height:21px;
			font-size:10px;
			color:rgba(75,75,75,1.00);
			display:inline-block;
			text-decoration:none;
			padding:0px;
			}
		
		#leftmenu {
		width:30%;
		height:100%;
		float:left;
		text-align:center;
		font-family:"Helvetica Neue", "Helvetica Neue Light";
		}
		
		#menubar2 nav {
		z-index:400px;
		max-height:400px;
		width:100%;
		padding:0px;
		margin:10px auto;
		font-size:6px;
		}
		
		
	 #menubar2 nav ul li a {
		color:rgba(75,75,75,1.00);
		display:inline-block;
		text-decoration:none;
		padding:2px;
		
		}
		
#categorias img{
		width:24%;
		height:100%;
	    float:left;
		}
		
		}	
	.texto-plafones{
		margin:0px;
		padding:27px;
		width:100%;
		height:100%;
		font-size:12px;
		text-align:left;
		float:left;
		color:hsla(210,100%,20%,1.00);
		font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif
		
		}
	  
	#menubar2 nav ul li:hover{
		width:50%;
		background:rgba(28,44,95,1.00);
		
		}	
		#menubar2 nav ul li:hover a{
			
		color:rgba(255,255,255,1.00)
		}
		
	#menubar2 nav ul li a {
		color:rgba(75,75,75,1.00);
		
		
		padding:0px;
		
		}  
	  
	  }