@charset "utf-8";
/* CSS Document */
body {
	margin: 0 auto;
	background-image: url(../img/oficina1.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
	
}
.maker{
	width: 98%;
	height: auto;
	font-family: Gotham, "Helvetica Neue", Helvetica, "sans-serif",Haettenschweiler, "Franklin Gothic Bold", "sans-serif";
	font-size: 1.1em;
	text-align: justify;
	background-color: rgba(184,197,255,0.77);
}
h1 {
	text-align: center;
	font-size: 2.7em;
	color: #003366;
}
h2{
	color: rgba(0,75,116,1.00);
	font-size: 1.9em;
	text-align: center;
}
.soft{
	width: 100%;
	height: auto;
	
	float: left;
}
.soft img{
	width: 100%;
	height: auto;
	float: left;
	margin-top: 15px;
	margin-bottom: 15px;
}
.office{
	height: 150px;
	display:flex;
    justify-content: space-around;
}

.tm{
	float: left;
	width: 20%;
	margin: 10px;
}
.tm img{
	width: auto;
	height: 100px;
}
.tm img:hover{
	height: 95px;
	background-color: rgba(0,0,0,0.6);
}
.text{
	width: 100%;
	height: auto;
}
.icono{
	width: 100%;
	height: auto;
	
}
.icono img{
	width: 100%;
}
.icono1, .icono2, .icono3{
	width: 100%;
	height: auto;
	float: right;
	text-align: justify;
	
}
.icono1 img{
	width: 20%;
	float: left;
	/*padding-right: 10px;*/
	margin-top: 10vh;
}
.icono2 img{
	width: 100%;
	display: flex;
}
.icono3 img{
	width: 90%;
	display: flex;
}
.icono4 img{
	width: 50%;
	float: left;
}
a {
	text-decoration: none;
	color: white;
	
}
li{
 list-style: none;
	
}

.links {
	color:rgba(2,255,0,1.00);
	font-weight: bold;
	width: 100%;
	float: right;
	background-color: rgba(0,0,0,0.76);
}
.links:hover {
	color:rgba(255,182,0,0.89);
}
.td1{
	float: left;
	width: 25%;
	height: auto;
	text-align: center;
	padding-top: 1vh;
}
.td1:hover{
	color: rgba(255,103,0,0.80);
}
/*************************************************************************************/
@media screen and (max-width:640px) {
	.maker{
		height: auto;
	}
	.icono img, .icono2 img{
		display: flex;
	}	
	.icono1 img{
	margin-top: 100px;	
	}
	.icono2 img, .icono3 img{
		margin-top: 20px;
		margin-bottom: 15px;
	}
	.icono4{
		margin-top: 15px;
	}
}
/*************************************************************************************/
@media screen and (max-width:1024px) and (min-width:640px) {
.maker{
	height: auto;
	max-height: auto;}

.office{
	width: 100%;
	overflow: hidden;
	}
.office img{
		max-height: 100px;
	
	}
.icono img{
	margin-top: 30px;
	margin-bottom: 30px;
	display: flex;
		max-width: 500px;
	}
.text{
	width: 100%;
	}
.text p {
	float: left;
	width: 50%;
	margin-top: 30px;
	}
.text img{
	width: 50%;
	max-height: 250px;
		float: left;
	}
	.icono1{
		margin-bottom: 20px;
	}
.icono1 img{
	width: 100px;
	margin-top: 40px;
}
	.icono2{
		margin-top: 25px;
	}
	.icono2 img, .icono3 img{
		display: flex;
		width: 500px;
		margin-bottom: 15px;
	}
	.icono4{
		margin-top: 20px;
	}
	.icono4 img{
		max-width: 200px;
		height: auto;
	}
}
/*************************************************************************************/
@media screen and (min-width:1024px) {
.maker{height: 2530px;}

.office{
	width: 100%;
	overflow: hidden;
	}
.office img{
		max-height: 150px;
	
	}
.icono img{
	margin-top: 30px;
	margin-bottom: 30px;
	display: flex;
		max-width: 600px;
	}
.text{
	width: 100%;
	}
.text p {
	float: left;
	width: 50%;
	margin-top: 30px;
	}
.text img{
	width: 50%;
	max-height: 350px;
		float: left;
	}
	.icono1{
		margin-bottom: 20px;
	}
.icono1 img{
	width: 150px;
	margin-top: 40px;
}
	.icono2{
		margin-top: 25px;
	}
	.icono2 img, .icono3 img{
		display: flex;
		width: 600px;
		margin-bottom: 15px;
	}
	.icono4{
		width: 70%;
		margin-top: 20px;
	}
	.icono4 img{
		max-width: 180px;
		height: auto;
		margin-right: 50px;
	}
	.links{padding-top: 25px;}
	.td1{
		height: 50px;
	}
}