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

html{
	scroll-behavior: smooth;
}
body{
	margin: 0;
	padding: 0;
	background-color: #fff;
	font-family: "Krub", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
}

/* M E N U */

header {
    overflow: hidden;
    position: fixed; /* Set the navbar to fixed position */
    top: 0; /* Position the navbar at the top of the page */	
    z-index: 1000;
	width: 100%;
	background-color: #fff;
}
.navbar{
    padding: 15px 40px;
    display: flex;
    justify-content: space-between;
    align-items:baseline;
}

nav {
	display: flex;
}

nav a {
	color: #7f7d7d;
    text-decoration: none;
    padding: 0px 10px;
    margin-right: 10px;
	font-size: 14px;
    font-weight: 400;
	line-height: 20px;
}
nav a:hover {
	color: #9b1715;
    text-decoration: none;
}
.linea{
	width: 100%;
	height: 1px;
	background-color: #c65131;
}
.logo {
	width: 56px;
	height: 70px;
}
img{
	max-width: 100%;
	height: auto;

}
.burger {
    display: none;
    flex-direction: column;
    cursor: pointer;
	position: absolute;
	right:20px;
	top:65px;
	z-index: 1000;
}
.line {
    width: 25px;
    height: 3px;
    background-color: #FF0004;
    margin: 3px 0;
}
/* L I N K S */

a {
	color: #fff;
	font-size: 14px;
	font-weight: 400;
	line-height: 22px;
	text-decoration:none;
}
a:hover{
	color: #ffa619;
	text-decoration:none;	
}

/* S E C T I O N S */

.big-banner{
	margin-top: 95px;
	with: 100%;
	background-color: #9c1d18;
	padding: 50px;
	display: flex;
	flex-direction: column;
	align-items: center;
	background-image:url("../images/background-soluciones-half.png");
	background-position: center center;
	background-repeat: none;
	background-size: cover;
}
.cuatro-soluciones{
	width: 1200px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin: 50px 0 0 0;
}
.soluciones-combos{
	flex-direction:column;
	align-content: flex-end;
	cursor: pointer;
    width: 20%; 
  	height: 330px;
	padding: 0 1% 30px 2%;	
	border-radius: 15px;
	background-repeat: no-repeat;
 	background-size:100%;
  	background-position:center center;
	-webkit-transition: all 500ms cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -moz-transition: all 500ms cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -ms-transition: all 500ms cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -o-transition: all 500ms cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    transition: all 500ms cubic-bezier(0.000, 0.000, 0.580, 1.000); /* ease-out */	
}
.soluciones-combos-ai{
	display: flex;
	flex-direction: row;
	cursor: pointer;
    width: 20%; 
  	height: 330px;
	padding: 0 1% 30px 2%;	
	border-radius: 15px;
	background-repeat: no-repeat;
 	background-size:100%;
  	background-position:center center;
	-webkit-transition: all 500ms cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -moz-transition: all 500ms cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -ms-transition: all 500ms cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -o-transition: all 500ms cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    transition: all 500ms cubic-bezier(0.000, 0.000, 0.580, 1.000); /* ease-out */	
}
.soluciones-uno{
  	background-image: url("../images/solucion-seguridad-fisica.jpg"); 
}
.soluciones-uno:hover {
	background-size: 115%;
}
.soluciones-dos{
	background-image: url("../images/solucion-seguridad-electronica.jpg");
}
.soluciones-dos:hover {
	background-size: 115%;
}
.soluciones-tres{
	background-image: url("../images/solucion-centros.jpg");
}
.soluciones-tres:hover {
	background-size: 115%;
}
.soluciones-cuatro{
	background-image: url("../images/solucion-software.jpg");
}
.soluciones-cuatro:hover {
	background-size: 115%;
}
.soluciones-cinco{
  	background-image: url("../images/solucion-1816-lite.jpg"); 
}
.soluciones-cinco:hover {
	background-size: 115%;
}
.soluciones-seis{
  	background-image: url("../images/solucion-1816-all.jpg"); 
}
.soluciones-seis:hover {
	background-size: 115%;
}
.boton-conozca-mas{
	display: flex;
	flex-direction: row;
	align-content: center;
	width: 100%;
	bottom: 30px;
}
.columna-uno-combos{
	align-content: flex-end;
	width: 79%;
}
.columna-dos-combos{
	margin: 30px 0 0 0;
	align-content:flex-start;
	flex-direction: column;
	width: 21%;
}
.espacio-svg{
	margin-bottom: 10px;
	height: 66px;
	width: 66px;	
}
.quienes-somos{
	width: 100%;
	background-color: #fff;
	padding: 75px 0px;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.nuestra-vision{
	width: 100%;
	padding: 50px 0px;
	background-color: #c44a28;	
	text-align: center;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
}
.contenedor-combos-mision-vision{
	padding-top: 30px;
	display: flex;
	flex-direction: row;
  	justify-content: center;	
	width: 1200px;
	margin: auto;
	column-gap: 2%;
}
.combos-mision-vision{
	width: 45%;
	padding: 30px;
	border-radius: 15px;
	border: 1px solid #d6d6d6;
	color: #fff;
	text-align: left;
}
.pvr{
	width: 100%;
	padding: 50px 0px;
	background-color: #f2f2f2;
	display: flex;
	flex-direction: row;
  	justify-content: center;
	border: 1px solid #fff;
}

.columna-izquierda-imagen{
	display: flex;
  	justify-content: center;
  	align-items: center;
	width: 600px;
}
.columna-derecha-texto{
	display: flex;
  	justify-content: center;
	flex-direction: column;
	width: 550px;
	padding: 0 0 0 50px;
}
.seguridad-fisica{
	width: 100%;
	display: flex;
	padding: 50px 0px 20px 0px;
	align-items: center;
	text-align: center;
	flex-direction: column;
}
.seguridad-electronica{
	width: 100%;
	display: flex;
	padding: 50px 0px 50px 0px;
	align-items: center;
	text-align: center;
	flex-direction: column;
}
.imagenes-seguridad{
	width: 1200px;
	height: 500px;
	position: relative;
	padding: 30px 0px;
}
.imagen-absoluta-principal{
	position: absolute;
	border-radius: 15px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */
    max-height: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */
}
.imagen-absoluta-izquierda{
	position: absolute;
	top: 15%;
	left: 0px;
	border-radius: 15px;
    max-width: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */
    max-height: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */	
}
.imagen-absoluta-derecha{
	position: absolute;
	bottom: 15%;
	right: 0px;
	border-radius: 15px;
    max-width: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */
    max-height: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */	
}
.contenedor-combos-fisica{
	width: 1200px;
	height: auto;
	display: flex;
	flex-direction: row;
	column-gap: 2%;
	padding: 30px 0px;
}
.combos-fisica{
	width: 32%;
	padding: 30px;
	border-radius: 15px;
	border: 1px solid #d6d6d6;
}
.contenedor-combos-electronica{
	width: 1200px;
	height: auto;
	display: flex;
	flex-direction: row;
	padding: 30px 0px 0px 0px;
	justify-content: space-between;
	flex-wrap:wrap;
}
.combos-electronica{
	width: 19%;
	border-radius: 15px;
	border: 1px solid #d6d6d6;
	padding: 30px 2%;
	margin-bottom: 30px;
}
.columna-derecha-imagen{
	display: flex;
  	justify-content: center;
  	align-items: center;
	width: 600px;
}
.columna-izquierda-texto{
	display: flex;
  	justify-content: center;
	flex-direction: column;
	width: 550px;
	text-align: left;
	padding:0 50px 0 0;
}
.imagenes-centros-de-monitoreo{
	width: 100%;
	height: 550px;
	position: relative;
} 
.imagen-absoluta-principal-monitoreo{
	position: absolute;
	border-radius: 15px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */
    max-height: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */
}
.imagen-absoluta-izquierda-monitoreo{
	position: absolute;
	left: 5%;
	border-radius: 15px;
    max-width: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */
    max-height: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */	
}
.imagen-absoluta-derecha-monitoreo{
	position: absolute;
	bottom: 0px;
	right: 0px;
	border-radius: 15px;
    max-width: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */
    max-height: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */	
}
.software{
	width: 100%;
	padding: 50px 0px;
	background-color: #fff;
	display: flex;
	flex-direction: row;
  	justify-content: center;
}
.imagenes-software{
	width: 100%;
	height: 500px;
	position: relative;
} 
.imagen-absoluta-principal-software{
	position: absolute;
	right: 2%;
	top:0px;
	border-radius: 15px;
    max-width: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */
    max-height: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */	
}
.imagen-absoluta-izquierda-software{
	position: absolute;
	left: 10%;
	bottom: 2%;
	border-radius: 15px;
    max-width: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */
    max-height: 100%; /* Opcional: asegura que la imagen no se desborde del contenedor */	
}
.contacto{
	width: 100%;
	background-color: #f2f2f2;
	padding: 50px 0px;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.formulario{
	width: 500px;
	display: flex;
	flex-direction: column;
	padding: 30px 0 0 0;
 	justify-content: center;
    align-items: center;
}
.contenedor-datos{
	width: 100%;
	display: flex;
	flex-direction: row;
	padding: 0 0 13px 0;
	align-items: center;
}
.datos{
	width: 28%;
	text-align: left;
}
.campos{
	width: 68%;	
	text-align: left;
}
.campos-de-texto{
	height: 32px;
	width: 98%;
	border: solid 1px #898989;
	background-color: #fff;
	border-radius: 8px;
	font-size: 16px;
    font-family: "Krub", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
	padding: 0 0 0 2%;
	color: #2f2f2e;
}
.desplegable{
	position: relative;	
	height: 36px;
	width: 100.5%;
	border: solid 1px #898989;
	background-color: #fff;
	border-radius: 8px;
	font-size: 16px;
    font-family: "Krub", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
	padding: 0 0 0 2%;
 	 -webkit-appearance: none; /* Elimina la apariencia predeterminada de Safari */
  	-moz-appearance: none;
  	appearance: none;
  	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" fill="%23666"><path d="M7 10l5 5 5-5z"/><path d="M0 0h24v24H0z" fill="none"/></svg>');
  	background-repeat: no-repeat;
  	background-position: right 10px center; /* Ajusta la posición de la flecha */
  	background-size: 16px; /* Tamaño de la flecha */
	color: #2f2f2e;
}
.mensaje-de-texto{
	height: 150px;
	width: 98%;
	border: solid 1px #898989;
	background-color: #fff;
	border-radius: 8px;
	font-size: 16px;
    font-family: "Krub", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
	padding: 0 0 0 2%;
	color: #2f2f2e;
}
.trabaja-con-nosotros{
	width: 100%;
	display: flex;
	padding: 50px 0;
	background-color: #fff;
	align-items: center;
	justify-content: center;
	text-align: center;
	
}
.sumate-a-nuestro-equipo{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 1200px;
	background-image: url("../images/background-sumate.png");
	background-repeat: no-repeat;
	background-size:cover;
	background-position: center center;
	padding: 50px 0;
	border-radius: 15px;
}

/* F O O T E R */

footer{
	width: 90%;
	background-color: #505050;
	padding: 50px 5%;
}
.contenedor-footer{
	display: flex;
	flex-direction: row;
	justify-content: space-between;	
}
.combos-footer{
	width: 23%;
	aword-break: break-all;	
}
ul {
    list-style-type: none;
	margin: 0;
	padding: 0;
}
li{
	margin-bottom: 10px;
}

/* F O N T S */

.titular-50{
	font-size: 50px;
    font-weight: 600;
	color: #fff;
	text-align: center;
	margin: 0px;
}
.titular-30{
	font-size: 30px;
	line-height: 40px;
    font-weight: 400;
	color: #fff;
	text-align: center;
	margin: 10px;
}
.titular-30-naranja{
	font-size: 30px;
    font-weight: 500;
	color: #c65131;
	text-align: center;
	margin: 10px 0px;
}
.titular-30-naranja-left{
	font-size: 30px;
    font-weight: 500;
	color: #c65131;
	text-align: left;
	margin: 10px 0px;
}
.titular-25-blanca{
	font-size: 25px;
	line-height: 35px;
    font-weight: 500;
	color: #fff;
	text-align: center;
	margin: 5px 0px 20px 0;
}
.texto-18{
	font-size: 18px;
    font-weight: 400;
	color: #fff;
	text-align: center;	
	max-width: 65ch;
	margin: 10px 0 0 0;
}
.texto-20{
	font-size: 21px;
    font-weight: 600;
	color: #fff;
	text-align: left;	
}
.texto-20-gris{
	font-size: 20px;
    font-weight: 500;
	color: #2f2f2e;
	text-align: center;	
	margin: 25px 0px 10px 0px;
}
.texto-20-gris1{
	font-size: 20px;
    font-weight: 500;
	color: #fff;
	text-align: left;	
	margin: 0 0 10px 0;
}
.texto-20-blanco{
	color: #fff;
	text-align: left;
}
.font-blanca-combos{
	text-align: left;
	max-width: 100%;
	color: #fff;
}
p {
	font-size: 16px;
    font-weight: 400;
    font-style: normal;
	margin: 0px;
	padding: 0px;
	color: #2f2f2e;
	line-height: 25px;
}
.font-gris-titulares{
	font-size: 35px;
    font-weight: 500;
	margin: 0px;
	padding: 0px 0px 10px 0px;	
	color: #2f2f2e;
}
.font-blanca-titulares{
	font-size: 35px;
    font-weight: 500;
	margin: 0px;
	padding: 0px 0px 10px 0px;	
	color: #fff;
}
.font-gris-copy-quienes-somos{
	text-align: center;
	max-width: 70ch;
}
.font-gris-copy{
	text-align: center;
	max-width: 70ch;
	font-size: 16px;
}
.font-gris-copy-mision-vision{
	text-align: center;
	max-width: 70ch;
	font-size: 16px;
	color: #fff;
}
.font-gris-combos{
	text-align: center;
	max-width: 100%;
}
.font-datos{
	font-size: 16px;
    font-weight: 400;
	margin: 0px;
	padding: 0px 0px 10px 0px;	
	color: #2f2f2e;	
}
.font-footer{
	font-size: 14px;
    font-weight: 400;
	margin: 0px;
	padding: 0px 0px 10px 0px;	
	color: #fff;	
}
.conozca-mas{
	font-size: 15px;
    font-weight: 400;
	color: #fff;
	text-align: left;
	padding-right: 10px;
}
/* B U T T O N S */

.button {
    font-family: "Krub", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;	
	font-size: 16px;
	color: #000;
    padding: 12px 40px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    transition-duration: 0.4s;
	border-radius: 8px;
	border: none;
	width: 250px;
}
.button1 {
  background-color: #ee4c0c; 
  color:#fff; 
}

.button1:hover {
  background-color: #cb2316;
  color: #fff;
}
.button2 {
  background-color: #fff; 
  color:#ee4c0c; 
}

.button2:hover {
  background-color: #ffa619;
  color: #000000
}
/* S U M A T E */
.small-banner{
	margin-top: 95px;
	with: 100%;
	background-color: #9c1d18;
	padding: 50px;
	display: flex;
	flex-direction: column;
	align-items: center;
	background-image:url("../images/background-soluciones-half.png");
	background-position: center center;
	background-repeat: none;
	background-size: cover;
}
.titular-40{
	font-size: 40px;
    font-weight: 600;
	color: #fff;
	text-align: center;
	margin: 0px;
}
.formulario-sumate{
	margin: auto;
	width: 900px;
	display: flex;
	flex-direction: column;
	padding: 30px 0;
 	justify-content: center;
    align-items: center;
	text-align: center;
}
.titular-23-naranja{
	font-size: 21px;
    font-weight: 500;
	color: #c65131;
	text-align: center;
	margin: 10px 0px;
}
.datos-personales-contenedor{
	width: 100%;
	padding: 10px 0;
}
.datos-personales{
	width: 100%;
	display: flex;
	flex-direction: row;
	padding: 10px 0 5px 0;
	justify-content: space-between;
}
.datos-personales-cv{
	width: 100%;
	display: flex;
	flex-direction:column;
	padding: 10px 0 5px 0;
	justify-content:center;
	row-gap: 20px;
	align-items: center;
}
.datos-personales-columna{
	width: 45%;
	display: flex;
	flex-direction: column;
}
.linea-formulario{
	width: 100%;
	height: 1px;
	background-color: #c65131;
	margin-bottom: 20px;
}
.donde-vivis{
	width: 25%;
	display: flex;
	flex-direction: row;
	align-items: center;
	text-align: center;
	justify-content: flex-start;
}
.licencia{
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	text-align: center;
	justify-content: center;
}
.check-box{
	margin: 0 10px 0 0;
	padding: 0;
	height: 15px;
	width: 15px;
	border: solid 1px #898989;
	transform: scale(1.2);
}
.upload-container {
    font-family: "Krub", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;	
	font-size: 14px;	
    position: relative;
    width: 150px; /* Ancho del contenedor */
    overflow: hidden;
    background-color: #898989; /* Color de fondo del contenedor */
    color: #fff; /* Color de texto */
	display: inline-block;
    text-align: center;
    line-height: 40px;
    cursor: pointer;
    border-radius: 8px;
	transition-duration: 0.4s;
	margin-bottom: 20px;
}
.upload-container:hover {
    background-color: #cb2316; /* Color de fondo del contenedor */
    color: #fff; /* Color de texto */
}

/* Estilo para el botón de carga real (input type="file") */
.upload-container input[type="file"] {
    position: absolute;
    top: 0;
    left: 0;	
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}
.copyright{
	width: 100%;
	text-align: center;
	font-size: 14px;
	color: #fff;
	background-color: #505050;	
	display: flex;
	justify-content: center;
}
.font-copyright{
	font-size: 14px;
    font-weight: 400;
	margin: 0px;
	padding: 0;
	color: #fff;	
}
.boton-enviar{
	width: 90%;
	padding: 30px 5% 0 5%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.gracias{
	width: 100vw;
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2000;
	background-color: rgba(0,0,0,0.85);
	position: fixed;
	top: 0;
	left: 0;
}
.gracias-contenedor{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;	
	width: 50%;
	padding: 50px;
	background-image: url("../images/background-sumate.png");
	background-position: center center;
	background-repeat: none;
	background-size: cover;
	border-radius: 15px;
}
.linea-blanca{
	height: 1px;	
	width: 100%;
	background-color: #AEAEAE;
	margin: 20px 0;
}
sup {
  vertical-align: super;
  font-size:60%;
}