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

*{
	padding:0;
	margin:0;
	box-sizing:border-box;
		-ms-box-sizing:border-box;
		-moz-box-sizing:border-box;
		-o-box-sizing:border-box;
		-webkit-box-sizing:border-box;
	transition:all ease-out 100ms;
		-webkit-transition:all ease-out 100ms;
		-moz-transition:all ease-out 100ms;
		-o-transition:all ease-out 100ms;
		-ms-transition:all ease-out 100ms;
	text-decoration:none;
	list-style:none;
	}
	
body { 
	font-family: 'Yantramanav', sans-serif;
	font-family: 'Fira Sans', sans-serif;
	background:#FFF;
	}

header {
	width:100%;
	padding-top:0px;
	height:4em;
	position:fixed;
	z-index:2000 ;
	background-color:#ffdc00;
	border-bottom:#FFF 4px solid;

}

header nav {
	width:100%;
}
 
.menu_bar {
	display:none;
}
 
header nav ul {
	overflow:hidden;
	list-style:none;
}
 
header nav ul li {
	float:left;
	padding:10px;
}
 
header nav ul li a {
	color:#0071bc;
	padding:10px;
	text-decoration:none;
	display:inline-block;
}
 
header nav ul li span {
	margin-right:10px;
}
 
header nav ul li a:hover {
	border-bottom: 1px solid #29abe2;
	color:#29abe2;
}

	/*Contenedor*/
	
#contenedor {
	max-width:980px;
	padding-top:60px;
	margin: 0 auto;
	height:auto;
	}

img {
	max-width:100%;
	height:auto;
	width:auto\9;
	vertical-align:middle;
	}
	
/*secciones*/

.solo {
	max-width:62em;
	display:block;
	margin:0 auto;
	padding:8px;
	text-align:center;
	}

aside {
	width:45%;
	height:auto;
	display:inline-block;
	padding:8px;
	vertical-align:top;
	}
	
/*PORTAFOLIO*/

#portafolio {
	width:100%;
	margin:0 auto;
	padding:5px;
	text-align:center;

	
	}

section {
	max-width:25em;
	display:inline-block;
	min-height:20em;
	position:relative;
	overflow:hidden;
	margin:10px;
	border:rgba(204,204,204,0.1) 10px inset;
	border-radius:8px;
	}

.txtbtn {
	position:absolute;
	width:100%;
	height:100%;
	background:rgba(51,51,51,0.8);
	background:-webkit-gradient(linear, 11% 100%, 10% 21%, from(#2F93FF), to(#0072BD));
	padding:15px;
	opacity:0;
	transition:all 300ms;
		-webkit-transition:all ease-out 300ms;
		-moz-transition:all ease-out 300ms;
		-o-transition:all ease-out 300ms;
		-ms-transition:all ease-out 300ms;
	cursor:pointer;
		}

.txtbtn:hover {
	opacity:0.8;
	}
	
.txtbtn:active {
	opacity:0.8;
	}
	
.ver {
	position:absolute;
	width:90%;
	text-align:left;
	top:35%;
	
	background-color:#333333;
	cursor:pointer;
	padding:5px;
	height:auto;
	border-radius:5px;
}

.ver:hover {
	background-color:#004162;
	}
	
.bt-volver {
	width:6em;
	height:2em;
	padding:2px;
	cursor:pointer;
	border:#29abe2 2px solid;
	border-radius:3px;
	margin:0 auto;
	}

.bt-volver:hover {
	border:#333333 2px solid;

	}



/*PORTAFOLIO*/


.benefits {
	padding:5px;
	}
	

#doppler_subscription{
	display:block;
	margin:0 auto;
			}

#entrada {
	max-width:60em;
	padding:8px;
	display:block;
	min-height:14em;
	max-height:25em;
	position:relative;
	}

#entrada ul {
	max-height:30em;
	padding:8px;
	}

#imagenes {
	width:6em;
	padding:8px;
	float:left;
	}

#entrada ul li {
	display:inline-block;
	max-width:22em;
	height:6em;
	float:left;
	padding:8px;
	}
	
.mapa800 {
	display:block;
	margin:0 auto;

	}

.mapa300 {
	display:none;
	}
	
/*SLIDESHOW*/
.main {
	width:90%;
	max-width:1000px;
	margin:20px auto;
}
 
.slides {
	width:100%;
}
 
.slides img {
	width:100%;
}
 
.slidesjs-pagination {
	background:#424242;
	list-style:none;
	overflow:hidden;
}
 
.slidesjs-pagination li {
	float:left;
}
 
.slidesjs-pagination li a {
	display:block;
	padding:10px 20px;
	color:#fff;
	text-decoration:none;
}
 
.slidesjs-pagination li a:hover {
	background:#000;
}
 
.slides .active {
	background:#F6F;
}
 
.slidesjs-navigation{
	background:#000;
	color:#fff;
	text-decoration:none;
	display:inline-block;
	padding:13.5px 20px;
	float:right;
}


/*SLIDESHOW*/
 
.main {
	width:90%;
	max-width:1000px;
	margin:20px auto;
}
 
.slides {
	width:100%;
}
 
.slides img {
	width:100%;
}
 
.slidesjs-pagination {
	background:#29abe2;
	list-style:none;
	overflow:hidden;
	height:2.6em;
}
 
.slidesjs-pagination li {
	float:left;
}
 
.slidesjs-pagination li a {
	display:block;
	padding:10px 20px;
	color:#29abe2;
	text-decoration:none;
}
 
.slidesjs-pagination li a:hover {
	background:#29abe2;
	color:#29abe2;
}
 
.slides .active {
	background:#29abe2;
}
 
.slidesjs-navigation{
	background:#29abe2;
	color:#fff;
	text-decoration:none;
	display:inline-block;
	padding:12px 20px;
	float:center;
	height:2.6em;
}

.slidesjs-



/*SLIDESHOW*/
	
/*Slider Clientes*/

.slider {
	width: 95%;
	margin: auto;
	overflow: hidden;
	background:#FFF;
	opacity:0.3;
	}

.slider ul {
	display: flex;
	padding: 10px;
	width: 100%;
/*	animation: cambio 50s infinite linear;*/
	}

.slider li {
	width: 90%;
	list-style: none;
	padding:10px;
	}

.slider img {
	width: 100%;
	}

@keyframes cambio {
	50% {margin-left: -80%;}
}

	
/*TEXTOS*/

	h1 {
		font-family: 'Fira Sans', sans-serif;
		color:#004162;
		font-size:40px;
		}
		
	.strong {
		font-family: 'Fira Sans', sans-serif;
		color:#ffdc00;
		font-size:40px;
		}

	
	h2 {
		font-family:'Yantramanav', sans-serif;
		color:#333333;
		font-size:21px;
		font-weight:300;
		}
	
	h3 {
		font-family:'Yantramanav', sans-serif;
		color:#FFF;
		font-size:28px;
		font-weight:300;
		line-height:1.2;
		}
		
	h4 {
		font-family:'Yantramanav', sans-serif;
		color:#666;
		font-size:18px;
		font-weight:300;	
		}

	h5 {
		font-family:'Yantramanav', sans-serif;
		color:#FFF;
		font-size:17px;
		text-align:left;
		font-weight:300;
		}

	h6 {
		font-family: 'Fira Sans', sans-serif;
		font-size:25px;
		color:#FFF;
		}
	
.titulos {
		text-align:center;
		display:block;
		max-width:100%;
		padding:10px;
		line-height:1.0;
		}
		
/*Footer*/

footer {
	width:100%;
	background:#333333;
	}

.footer-cont {
	background:url(../Img/diseno-plano-ingenieria-bogota.png) no-repeat;
	display:block;
	max-width:61em;
	height:10em;
	margin:0 auto;
	padding:6px;
	}
	

.mapa {
	display:block;
	margin:0 auto;
	max-width:40em;
	height:3em;
	padding:5px;
	box-sizing:border-box;
	vertical-align:central;
}

.mapa ul{
	text-align:center;
	margin:0 auto;

	}

.mapa ul li {
	display:inline-block;
	padding:10px;
	}	

	
.mapa ul li a {
	float:left;
	padding:5px;
	cursor:pointer;
	color:#ffdc00;
	font-family:'Yantramanav', sans-serif;
	font-size:13px;
	font-weight:100;
	}
	
.mapa ul li a:hover {
	color:#333;
	background-color:#ffdc00;
	border-radius:3px;
	}
	

.datos {
	display:block;
	margin:0 auto;
	max-width:40em;
	padding:10px 5px 5px 5px;
	box-sizing:border-box;
	}
	
.datos ul{
	text-align:center;
	margin:0 auto;
	vertical-align:central;
	}

.datos ul li {
	display:inline-block;
	}	

.marca {
	display:block;
	padding:8px;
	text-align:center;
	background-color:rgba(204,204,204,0.8);
	filter: grayscale(100%)
		}
		
.by {
	display: block;
	padding:3px;
	text-align:center;
	background-color:#333333;
	}

/*Footer*/

/*Responsive*/
@media screen and (max-width:980px ) {
	header nav {
		width:80%;
		height:100%;
		left:-100%;
		margin:0;
		position: fixed;
	}
 
	header nav ul li {
		display:block;
		float:none;
		border-bottom:1px solid rgba(255,255,255, .3);
	}
 
	.menu_bar {
		display:block;
		width:100%;
		background:#ccc;
	}
 
	.menu_bar .bt-menu {
		display:block;
		padding:20px;
		background:#024959;
		color:#fff;
		text-decoration:none;
		font-weight: bold;
		font-size:25px;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
 
	.menu_bar span {
		float:right;
		font-size:40px;
	}
	
	.cabece {
		width:100%;
		height:auto;
		padding-top:50px;
		background:-webkit-gradient(linear, 48% 85%, 44% 0%, from(#006509), to(#317822))
	}
	
	#anuncio {
		width:100%;
		margin:0 auto;
		height:30em;
		background:url(../Img/leonel-silva-raigoso-cubarral.png) no-repeat;
		user-select: none;
			}
			
	#sub-anuncio2 {
		max-width:80%;
		height:auto;
		display:inline-block;
		margin-top:10%;
		margin-left:55%;
		}
	
	#inclina {
		transform:rotate(-3deg);
		height:5em;
		display:block;
		width:90%;
		background:#FFF;
		margin-top:-40px;
		}
	
	#entrada {
		max-width:90%;
		padding:8px;
		display:inline-block;
		text-align:left;
		}

	#anuncio-blog {
		display:inline-block;
		margin:0 auto;
		max-width:18em;
		max-height:18em;
		float:none;
		}
	
	footer {
		height:17em;
		width:100%;
		display:block;
		padding:8px;
		}
	.footer-cont {
		height:17em;
		padding:8px;
		}
	
	.mapa {
		border-left:none;
		border-right:none;
		text-decoration:underline;
	}

}

@media screen and (max-width:800px ) {
	header nav {
		width:50%;
		height:15%;
		left:-100%;
		margin:0;
		position: fixed;
		background-color:rgba(204,204,204,0.8);
	}
	
	header nav ul li {
		display:block;
		float:none;
		border-bottom:1px solid rgba(255,255,255,.3);
	}
	
	header nav ul li a {
		color:#0F47AF;
	}
	
	header nav ul li a:hover {
	background:#0F47AF;
	color:#FFF;
	}

 	.menu_bar {
		display:block;
		width:100%;
		background:#ccc;
	}
 
	.menu_bar .bt-menu {
		display:block;
		padding:20px;
		background:#CCC;
		color:#078930;
		text-decoration:none;
		font-weight: bold;
		font-size:25px;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
 
	.menu_bar span {
		float:right;
		font-size:40px;
	}
	
	.cabece {
		padding-top:60px;
		max-height:75em;
		min-height:52em;
	}
	
	#anuncio {
		width:auto;
		height:30em;
		background:none;
		user-select: none;
			}			

	#sub-anuncio1 {
		display:inline-block;
		width:100%;
		}
		
	#sub-anuncio2 {
		max-width:66em;
		padding:8px;
		margin:0;
		height:20em;
		}
		
	#inclina {
		transform:rotate(-3deg);
		max-height:5em;
		display:block;
		width:95%;
		background:#FFF;
		}
	
	#entrada {
		max-width:90%;
		margin:0 auto;
		padding:8px;
		display:block;
		text-align:left;
		}

	#anuncio-blog {
		display:block;
		min-height:18em;
		max-height:20em;
		margin:0 auto;
		width:100%;
		float:none;
				}
	
	footer {
		max-height:18em;
		width:100%;
		display:block;
		padding:8px;
		}
	.footer-cont {
		max-height:18em;
		padding:8px;
		}
	
	.mapa {
		border-left:none;
		border-right:none;
		text-decoration:underline;
	}

}

@media screen and (max-width:500px ) {
	
	header nav /*barra botones entra sale*/{
		width:80%;
		height:60%;
		left:-100%;
		margin:0;
		position:fixed;
		background-color:#29abe2;
	}
	
	header nav ul li {
		display:block;
		float:none;
		border-bottom:1px solid rgba(255,255,255, .3);
	}
	
	header nav ul li a {
		color:#FFF;
	}
	
	header nav ul li a:hover {
	background:#0F47AF;
	color:#FFF;
	}

 	.menu_bar {
		display:block;
		width:100%;
		background:#ffdc00;
		top:0;
	}
 
	.menu_bar .bt-menu {
		display:block;
		padding:20px;
		background:#ffdc00;
		color:#0071bc;
		text-decoration:none;
		font-size:25px;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
 
	.menu_bar span {
		float:right;
		font-size:40px;
	}
/*Cabecera*/
	.cabece {
		display:block;
		width:100%;
		background:-webkit-gradient(linear, 45% 100%, 44% 27%, from(#00193F), to(#002D5E));		}
		
		/*Video*/
	
	.pc	 {
		display:none;
		}
		
	.m  {
		display:block;
		width:100%;
		top:10%;
		z-index:1;
		position:absolute;
		}
	
	#declaracion {
		display:block;
		max-height:32em;
		margin:0 auto;
		top:45%;
		padding:8px;
		text-align:center;
				}
		
	#contenedor {
		padding:5em 0.3em 0.3em 0.3em;
		height:auto;
				}
				
	.solo {
		padding:8px;}

	aside {
		width:100%;
		margin:0 auto;
		height:auto;
		padding:1em;
		vertical-align:top;
	}
	
	footer {
		min-height:23em;
		max-height:35em;
		width:100%;
		display:block;
		padding:8px;
		}
	.footer-cont {
		min-height:15em;
		max-height:25em;
		padding:8px;
		}
	
	.mapa {
		display:block;
		margin:0 auto;
		max-width:20em;
		height:9em;
		padding:5px;
	}
	
	.mapa ul{
		text-align:left;
		margin:0 auto;
	
		}
	
	.mapa ul li {
		display:block;
		padding:10px;
		height:2em;
		}	
	
		
	.mapa ul li a {
		width:15em;
		float:left;
		padding:5px;
		cursor:pointer;
		color:#ffdc00;
		font-family:'Yantramanav', sans-serif;
		font-size:13px;
		font-weight:100;
		}
		
	.mapa ul li a:hover {
		color:#333;
		background-color:#ffdc00;
		border-radius:3px;
		}
		
	
	.datos {
		display:block;
		margin:0 auto;
		max-width:20em;
		padding:8px;
		}
		
	.datos ul{
		text-align:center;
		margin:0 auto;
		vertical-align:central;
		}
	
	.datos ul li {
		display:inline-block;
		min-width:3em;
		float:left;
		}	
	
	.marca {
		display:block;
		height:5em;
		width:100;
		padding:5px;
		margin:0;
		text-align:center;
		background-color:rgba(204,204,204,0.8);
		filter: grayscale(100%)
			}

	

}