@media (max-width: 575.98px) {
	#banner {
		padding: 150px 0px 50px !important;
		margin-top: 40px;
	} #banner a {
		font-size: 14px !important;
	} .connector-1, .connector-2, .connector-3 {
		display: none !important;
	} #cotizacion {
		padding: 80px 0px !important;
	} #portafolio .custom_dots {
		bottom: 0px !important;
  	} #banner #title-2 {
    	font-size: 38px !important;
	} #slider-portafolio div {
    	margin: 10px 0px !important;
	} #diseno-app .col-lg-5, #proceso-desarrollo .col-lg-6 {
		justify-content: center !important;
	}
} @media (min-width: 575.98px) and (max-width: 767.98px) {
	#banner {
		padding: 150px 0px 50px !important;
		margin-top: 40px;
	} #banner a {
		font-size: 14px !important;
	} .connector-1, .connector-2, .connector-3 {
		display: none !important;
	} #cotizacion {
		padding: 80px 0px !important;
	} #diseno-app .col-lg-5, #proceso-desarrollo .col-lg-6 {
		justify-content: center !important;
	}
} @media (min-width: 767.98px) and (max-width: 991.98px) {
	#banner {title-1
		padding: 150px 0px 50px !important;
		margin-top: 40px;
	} #banner a {
		font-size: 14px !important;
	} .connector-1, .connector-2, .connector-3 {
		display: none !important;
	} #cotizacion {
		padding: 80px 0px !important;
	} #diseno-app .col-lg-5, #proceso-desarrollo .col-lg-6 {
		justify-content: center !important;
	}
} @media (min-width: 991.98px) and (max-width: 1199.98px) {
	.connector-1, .connector-2, .connector-3 {
		display: none !important;
	} 
}

/* BANNER */
#banner {
	background-image: url('/img/aplicaciones/app-headerimg-full.jpg');
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;
	padding: 150px 0px 100px;
} #banner #title-1 {
	font-size: 50px;
	font-family: "Roboto-Light";
	line-height: 1;
	color: #ffffff ; /* white */
	text-shadow: 1px 1px 5px #fff;
} #banner #title-2 {
	font-size: 50px;
	line-height: 1;
	font-family: "Roboto-Medium";
	color: #ffffff ; /* white */
	text-shadow: 1px 1px 5px #fff;
} #banner a {
	background-color: #f4af19; /* yellow */
	color: #fff; /* white */
	text-decoration: none;
	font-family: "Roboto-Medium";
	padding: 20px 40px;
	border-radius: 5px;
} #banner a:hover {
  background-color: #ffffff; /* white */
  color: #0337af; /* blue */
}

/* Diseño App */
#diseno-app {
	padding: 60px 0px;
} #diseno-app p {
	font-size: 18px;
} #diseno-app #phone-app {
	width: 40%;
	position: relative;
	z-index: 1;	
} #diseno-app .connector-1 {
	position: absolute;
	right: 28%;
	top: 840px;
	width: 500px;
} #diseno-app .connector-1 img {
	width: 100%;
}

/* PROCESO DE DESARROLLO */
#proceso-desarrollo {
	padding: 60px 0px;
	background-image: url('/img/aplicaciones/METODIKA-APLICACIONES-FASE2BACK.webp');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
} #proceso-desarrollo .yellow-title {
	color: #f4af19; /* yellow */
} #proceso-desarrollo p {
	color: #fff; /* white */
	font-size: 18px;
} #proceso-desarrollo .connector-2 {
	position: absolute;
	top: 1340px;
	right: 50%;
	width: 300px;
} #proceso-desarrollo .connector-2 img {
	width: 100%;
} #proceso-desarrollo #phone-php {
	width: 45%;
	position: relative;
	z-index: 1;	
} 

/* CALIDAD DE APLICACIONES */
#calidad-aplicaciones {
	padding: 70px 0px;
} #calidad-aplicaciones p {
	font-size: 18px;
} #calidad-aplicaciones .connector-3 {
	position: absolute;
	top: 1680px;
	right: 25%;
	width: 450px;
} #calidad-aplicaciones .connector-3 img {
	width: 100%;
} #calidad-aplicaciones #phone-magnifier {
	position: relative;
	z-index: 1;
	width: 70%;
} 

/* COTIZACION */
#cotizacion {
	/*background-image: url('/img/aplicaciones/METODIKA-APLICACIONES-BANNERBACK.webp');*/
	background-color: #0a1476; /* blue */
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	padding: 80px 0px;
} #cotizacion #title {
	color: #fff;
	font-family: "Roboto-Regular";
	font-size: 45px;
} #cotizacion p {
	color: #fff;
	font-size: 18px;
	font-family: "Roboto-Regular";
} #cotizacion a {
	text-decoration: none;
	background-color: #f4af19; /* yellow */
	color: #fff; /* white */
	font-size: 18px;
	padding: 8px 20px;
	border-radius: 5px;
	font-family: "Roboto-Bold";
} #cotizacion a:hover {
	background-color: #fff; /* white */
	color: #0337af; /* blue */
}


/* PORTAFOLIO */
#portafolio .gray-line {
	width: 50%;
	height: 3px;
} #portafolio img {
	max-width: 100%;
} #portafolio .product {
	font-family: "Roboto-Regular";
} #portafolio p {
	line-height: 2;
	font-size: 16px;
} #portafolio .custom_dots {
  position: absolute;
  bottom: 100px;
  left: -35px;
  z-index: 1;
  list-style: none;
} #portafolio .custom_dots li {
  float: left ;
  width: 10px;
  height: 10px;
  border: 1px solid #e3e4e8; /* gray */
  margin-right: 10px;
  border-radius: 100%;
  cursor: pointer;
} #portafolio .custom_dots .slick-active {
  background-color: #0337af; /* blue */
}

/* INICAR PROCESO DE DESARROLLO DE UNA APLICACION */
#inicar-proceso {
	padding: 70px 0px;
	/*background-image: url('/img/aplicaciones/METODIKA-APLICACIONES-FASE2BACK.webp');*/
	background-color: #0a1476; /* blue */
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;	
} #inicar-proceso h2 {
	color: #fff; /* white */
} #inicar-proceso p {
	color: #fff; /* white */
} #inicar-proceso a {
	text-decoration: none;
	background-color: #f4af19; /* yellow */
	color: #fff; /* white */
	font-size: 18px;
	padding: 8px 20px;
	border-radius: 5px;
	font-family: "Roboto-Bold";
} #inicar-proceso a:hover {
	background-color: #fff; /* white */
	color: #0337af; /* blue */
}

/* NUESTROS CLIENTES */
#clientes {
  padding: 50px 0px;
  background-color: #272828; /* black */
} #clientes h2 {
  color: #fff; /* white */
} #clientes #slider-clientes {
  width: 90%;
} #clientes img {
  max-height: 45px;
} #clientes button {
  background-color: #272828; /* black */
  border: 0px;
  border-radius: 100%;
  width: 16px;
  height: 16px;
} #clientes button::before {
  color: #e3e4e8; /* gray */
  position: relative;
  top: 0px;
  left: -2px;
}