/* TIPOGRAFIA */


@font-face {
    font-family: 'Open Sans Regular';
    src: url('../fonts/Open_Sans/static/OpenSans-Regular.ttf');
}

@font-face {
    font-family: 'Open Sans Medium';
    src: url('../fonts/Open_Sans/static/OpenSans-Medium.ttf');
}

@font-face {
    font-family: 'Open Sans Light';
    src: url('../fonts/Open_Sans/static/OpenSans-Light.ttf');
}

@font-face {
    font-family: 'Open Sans Bold';
    src: url('../fonts/Open_Sans/static/OpenSans-Bold.ttf');
}

@font-face {
    font-family: 'Open Sans Extra Bold';
    src: url('../fonts/Open_Sans/static/OpenSans-ExtraBold.ttf');
}

@font-face {
    font-family: 'Arcade Gamer';
    src: url('../fonts/Arcade_Classic_Regular/ARCADECLASSIC.TTF');
}

@font-face {
    font-family: 'Weather Sunday';
    src: url('../fonts/weather_sunday/Weather_Sunday.otf');
}

@font-face {
    font-family: 'Ants Valley';
    src: url('../fonts/ants_valley/Ants_Valley.otf');
}


/* RESET */
p{font-size: 23px;font-family: 'Open Sans Regular';}
.h1-regular{font-family: 'Open Sans Regular';}
.h1-medium{font-family: 'Open Sans Medium'}
.h1-bold, .h2-bold{font-family: 'Open Sans Bold';}
.h1-extra-bold{font-family: 'Open Sans Extra Bold';}
.h2-regular{font-family: 'Open Sans Regular';}
.fs-28{font-size:28px}
.fs-40{font-size:40px}
.fs-48{font-size:48px}
.fs-35{font-size:35px}
.fs-50{font-size:50px}
.fs-53{font-size:55px}
.fs-55{font-size:58px; }
.fs-70{font-size:70px; }
.fs-80{font-size:80px; }
.fs-90{font-size:90px; }
.fs-130{font-size: 130px;}
.txt-right{text-align: right;}
.color-073152{color:#073152;}
.bckg-c-073152{background-color: #073152;}
.color-3f81c6{color:#3f81c6;}
.bckg-c-3f81c6{background-color: #3f81c6;}
.c-white, .bck-c-white{color:white;}
.c-yellow{color:yellow;}
.p0{padding:0px}
.m0{margin:0px}
.p-left20{padding-left:20px;}
.p-left30{padding-left:30px;}
.p-left50{padding-left:50px;}
.p-left65{padding-left:65px;}
.p-left40{padding-left:40px;}
.p-left120{padding-left:120px}
.p-left180{padding-left:180px}
.p-left200{padding-left:200px}
.p-left240{padding-left:240px}
.p-top-20{padding-top:40px}
.p-top-250{padding-top:250px}
.p-top-300{padding-top:300px}
.p-top-400{padding-top:400px}
.p-top-100{padding-top:100px}
.p-top-150{padding-top:150px}
.p-100{padding:100px}
.m-top-35{margin-top:35px;}
.m-top-30{margin-top:30px;}
.m-top-100{margin-top:100px;}
.m-top-200{margin-top:200px;}
.m-top-250{margin-top:250px}
.m-top-250{margin-top:250px}
.m-top-220{margin-top:220px;}
.m-top-270{margin-top:270px;}
.m-top-320{margin-top:320px}
.m-top-menos30{margin-top:-30px;}
.m-top-menos20{margin-top:-20px;}
.m-top-menos10{margin-top:-10px}
.m-top-menos150{margin-top:-150px;}
.m-top-menos100{margin-top:-100px}
.m-bottom-20{margin-bottom:20px}
.m-bottom-270{margin-bottom:270px}
.m-left50{margin-left:50px}
.wid-350{width:350px}
.wid-400{width:400px}
.wid-300{width:300px}
.wid-450{width:450px}
.wid-200{width:200px}
.wid-600{width:600px}
.mano-movil, .movil{display:none;}
.espacio-en-row{margin:150px 0px}
.espacio{margin:80px 0px}
.tabla{font-family: 'Open Sans Medium';}
.tabla tr td{
	text-align: center;
	font-size:28px;
}


/*Preloader*/
#loader {
    background: #ffffff;
    bottom: 0;
    height: 100%;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 9999;
}


#loaderInner {
    background:#ffffff url(../images/spinner.gif) center center no-repeat;
    height: 60px;
    left: 50%;
    margin: -50px 0 0 -50px;
    position: absolute;
    top: 50%;
    width: 60px;
}

/*********** HOME **********************************/
.tecnologia{
	background-image:url("../images/home/tecnologia1.jpg");
	background-position: center;
  	background-size: cover;
  	background-repeat:no-repeat;
  	max-width: 100%;
	height:500px;
}

.pistas{
	background-image:url("../images/home/pistas.png");
	background-size: 32%;
	background-repeat:no-repeat;
	background-position: left;
	height:700px;
	margin-top: -250px;
}

.logo-grande-home{
	width:450px;
}
.circulo{
	background-image:url("../images/home/circulo-1.png");
	background-size: 50%;
	background-repeat:no-repeat;
	background-position: right;
	height:1100px;
	margin-top:-140px;
}
#circulo{
	margin-top:100px;
	border:1px solid black; 
	border-radius:50%; 
	width:400px; 
	height:400px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-style: dotted;
    border-width: 6px;
    border-color: 660033;
}

.slogan{
	margin-top:-180px;
}


/**************  NOSOTROS  ****************************/
.background-nosotros{
	
	padding:0; 
	margin:0;
	margin-top:20px;

}

.nosotros-historia{
	padding-top: 30px;
}

.nosotros-mapa{
	background-image:url("../images/nosotros/mapa.png");
	background-position: center;
  	background-size: cover;
  	background-repeat:no-repeat ;
	
}

.mision-vision{
	
	position:relative;
	padding-top: 40px;

}
	.img-mision{width:100%; height:100%; padding:0; margin:0}
	.img-vision{width:100%; max-height:430px}

.nosotros-img1{
		 width:100%; 
		 height:900px; 
		 margin:0px;
	}
.back-circulo-mv{
	position:absolute; 
	top:0; 
	left:0; 
	width:100%; 
	height:1080px;
}

/************* SERVICIOS **************************/

 .list-portafolio{
 	padding: 70px;
 }
.title-ps{
	font-weight:bold; 
	font-size:60px;
}
.subtit-ps{
	margin-top:-25px; 
	color:#3F81C6; 
	font-size:57px;
}


.servicios-background{
	background-color: #073152;
	margin-top: 5px;
	position:relative;
}

.list-serv-1, .list-serv-2, .list-serv-3, .list-serv-4{
	font-family: 'Open Sans Regular';

}

	.li1{
		color:#3F81C6; 
		font-size:48px; 
		font-family: 'Open Sans Extra Bold';
		vertical-align: top;
	}
	.li2{
		font-size:37px;
		font-family: 'Open Sans Extra Bold';
		color:#073152;
		vertical-align: bottom;
	}

	.list-serv-3{margin-top:20px; padding-left: 25px}
	.list-serv-3 li:nth-child(odd){
		font-size:37px;
		font-family: 'Open Sans Bold';
	}

	.list-serv-3 li:nth-child(even){
		font-size:37px;
		font-family: 'Open Sans Medium';
	}

	.list-serv-4 li{
		padding:10px 0px;

	}
		.list-serv-4 li img{
			padding-left: 10px;
		}		

	.serv-4{width:250px; padding:10px; margin-bottom:60px}


#circulo-herramienta{
  border-radius:50%; width:230px; height:230px;
  background-color: #e6e6e6;
  display: flex;
  justify-content: center;
  align-items: center;
}

.logo-incompleto{
	padding-left: 0px; 
}


.mundo{
	background-image:url("../images/servicios/mapa.png");
	background-position: right;
	background-repeat:no-repeat;
	text-align: right;
	background-size:300px;
	height:290px;
}

.decoracion_superior{
	background-image:url("../images/servicios/adorno-superior.png");
	background-position: right;
	background-repeat:no-repeat;
	background-size: 76%;
}

.decoracion_inferior{
	background-image:url("../images/servicios/adorno-inferior.png");
	background-position: left;
	background-repeat:no-repeat;
	background-size: 76%;
	height:200px;
	margin-top:-100px;
}

.servicios_fabrica_software{
	background-image:url("../images/servicios/background-servicios.png");
	background-repeat:no-repeat;
	background-size: 65%;
	background-position: right;
}

.servicios-pistas-superior{
	position:absolute; top:0px; left:300px; width:500px; height:427px;
}

.servicios-pistas-inferior{
	position:absolute; bottom:-50px; left:580px; width:550px; height:110px;
}

.servicios-img1{
	 height:250px
}
.servicios-img2{
	 height:150px; width:350px; margin-right:25px;
}

/* TECNOLOGIAS  */
.tecnologias{
		position:relative;
}
	.col-degradado{
		background-color: rgba(7,49,82,0.5);  
		text-align: center; 
		margin: 0px 100px; 
		padding-top:200px;
	}
.lenguajes{
	background-color: #071B2D;
}
.background-tecnologias{
	background-image:url("../images/tecnologias/fondo-tecnologias.png");
	background-position: center;
	background-repeat:no-repeat;
	background-size: cover;
	height:800px;
	margin-top:-5px;
}

.bg-success {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-success-rgb), var(--bs-bg-opacity)) !important;
}

.list-plataformas{
	list-style: none; 
	color:white; 
	font-size:36px; 
	font-family:Open Sans Bold
}
.trazo-derecho{position:absolute; top:120px; right:0; width:275px; height:1300px}

/*************DESARROLLANDO PARA TI **************/
.desarrollando{background-color: #003155;}
.des-textos{ color:white; text-align: center}
.estamos{margin-left:-250px; margin-bottom:-30px; font-family:Open Sans Bold; font-size:90px;}
.desarrollando{font-family: Arcade Gamer; font-size:130px;}
.parati{margin-top:-50px; font-family:Open Sans Bold; font-size:90px; }


/**************** CLIENTES  **************************/
.clientes_background{
	background-image:url("../images/clientes/clientes-background.jpg");
	background-position: center;
	background-repeat:no-repeat;
	background-size: 100%;
	height:1030px;
	
	
}
.back-degrade-cli{
	background-color: rgba(0,0,0,0.6);  
    text-align: center; 
    color:white;
    padding: 40px;
    text-align: right;
}
.algunos{font-family: Ants Valley; font-weight:lighte}

/************* FOOTER *******************************/
.footer-background{
	background-image:url("../images/footer/background.jpg");
	background-position: center;
	background-repeat:no-repeat;
	background-size: cover;
	height:1600px;
}



/* dispositivos móviles */
/* cambios css para modo vertical  */

/* Smartphones (portrait & landscape) 
#Dispositivo = Mayoría de teléfonos móviles (vertical y horizontal) 
#Resolución = B/w 320px to 479px */
@media only screen and (max-width : 900px) {


	/* RESET Y TIPOGRAFIA */

	h1, .fs-48{font-size:23px}
	h2{font-size:20px}
	.desktop{display:none}
	.movil{display:block}	

	/* HOME */

	.tecnologia{max-width: 100%; height:300px;}
	.pistas{background-size: 50%; height:400px; margin-top:-160px;}
	.circulo{background-size: 60%;height:610px;}
	.slogan{margin-top:-200px;}
	.logo-grande-home{width:280px;}

	/*NOSOTROS*/

	.back-circulo-mv{display:none}
	.background-nosotros{padding:0; margin:0; margin-top:20px;}
	.nosotros-img1{width:100%; height:300px; margin:0px;}
	.mision-vision{margin-top:30px; position:relative;}
	.mision-vision h2 br{display: none;}
	.img-mision{width:300px; height:300px}
	.vision p0, .vision m0{display:none}
	#nosotros-apso-logo{display:none;}
	.nosotros-historia h2 br{display: none;}


	/* SERVICIOS */

	.portafolio_servicios br{display: none;}
	.portafolio_servicios .p-left50{padding-left:10px}
	.portafolio_servicios .p-left65{padding-left:10px}
	.title-ps{font-weight:bold; font-size:40px;}
	.subtit-ps{margin-top:-20px; color:#3F81C6; font-size:38px;}
	.li1{font-size:28px;}
	.li2{font-size:18px;}
	.pt-txt br{display:none}
	.servicios-pistas-superior{position:absolute; top:0px; left:110px; width:230px; height:167px;}
	.servicios-pistas-inferior{position:absolute; bottom:-35px; left:110px; width:230px; height:60px;}
	.txt-right{text-align: left;}
	.servicios-img1{width:100%;}
	.servicios-img2{height:150px; width:350px; vertical-align: center;}
	#circulo-herramienta{border-radius:50%; width:80px; height:90px;}
	#circulo-herramienta img{width:50px}
	.p-left40{padding-left:5px}
	.m-top-100{margin-top:250px}
	.logo-incompleto{width:200px; }
	.fs-50{font-size:26px}
	.p-left40{padding-left: 0px}
	.fs-90{font-size:57px}
	.fs-55{font-size:37px}
	.fs-53{font-size:28px;}
	.m-top-menos30{margin-top:-20px}
	.tabla tr td{font-size:17px}
	.list-serv-3 li:nth-child(odd), .list-serv-3 li:nth-child(even){font-size:24px;}
	.mano-movil{display: block;height:80%;width:90%;}
	.mano-desktop{display:none}
	.list-serv-4{margin-top: 40px;}
	.m-top-menos150{margin-top:-85px;}
	.decoracion_inferior{margin-top:-230px; background-size: 100%}
	.decoracion_superior{background-size: 100%;}
	.col-degradado{margin: 0px; padding-top:200px;}
	#circulo{margin-top:50px;width:300px; height:300px;}
	#circulo img{width:80%;}

	/**** tecnologias ***/

	.c-movil h1{text-align: center;}

	/***DESARROLLANDO***/

	.des-textos{text-align: center}
	.estamos, .desarrollando, .parati{font-size: 45px}
	.estamos{margin-left:0px; margin-bottom:0px;}
	.parati{margin-top:-10px;}


	/* clientes */

	.clientes_background{height:300px;width:100%;}
	.back-degrade-cli{
		padding: 15px;

	}
	.fs-90, .fs-70{font-size: 30px}
	.m-top-250{margin-top:60px}
	.p-top-300{paddin:0px}
	.p-left240{display:none}


	/* footer */
	.footer-background{height:800px;width:100%;}
	.wid-600, .wid-450, .wid-400, .wid-350{width:300px}
	.m-top-100{margin-top:35px; margin-bottom:35px}
	.p-left180{padding-left:15px}
	.p-top-400{padding-top:200px}
	.espacio{margin:0px}

}/* END CELULARES MODO VERTICAL */


/* 
  ##Dispositivo = Tablets, Ipads (vertical)
  ##Resolucion = B/w 768px to 1024px
*/
@media (min-width: 768px) and (max-width: 1024px) {
  
  .mano-movil{margin-left: 200px}
  .pt-txt br{display:block}
  
  .servicios-pistas-superior{position:absolute; top:0px; left:210px; width:250px; height:197px;}
  .servicios-pistas-inferior{position:absolute; bottom:-35px; left:210px; width:300px; height:90px;}
   
   #circulo-herramienta{border-radius:50%; width:120px; height:120px;}
   #circulo-herramienta img{width:80px}
}

@media (min-width: 1025px) and (max-width: 1366px) {

	.background-nosotros{margin-top:0px}
	.slogan{margin-top:-220px}

}