@font-face {
    font-family: 'Canava Grotesk';
    src: url('CanavaGrotesk-Regular.woff2') format('woff2'),
        url('CanavaGrotesk-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Casta';
    src: url('Casta-Thin.woff2') format('woff2'),
        url('Casta-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

body {
	font-family: 'Canava Grotesk';
}

h1, h2, h3 {
	font-family: 'Casta';
}

.fondo-azul {
	background-color: #004263;
}

.fondo-lila {
	background-color: #977DAA;
}

.fondo-azul-50 {
	background-color: #93ADBA;
}

.fondo-melon{
	background-color: #EA7963;
}

.texto-azul {
	color: #004263;
}

.bordes-50 {
	border-radius: 50px;
}

.fondo-banner-1 {
	width: 100%;
	height: auto;
	min-height: 720px;
	background-image: url(../img/bg-carrusel-80.jpg);
	background-size: cover;
	background-position: center;
	padding-top: 350px;
	padding-left: 30px;
	padding-right: 30px;
}

.fondo-bienvenidos {
	width: 100%;
	height: auto;
	min-height: 720px;
	background-image: url(../img/bg-content-80.jpg);
	background-size: cover;
	background-position: bottom;
}

.fondo-nosotros {
	width: 100%;
	height: auto;
	min-height: 200px;
	background-image: url(../img/bg-content-80.jpg);
	background-size: cover;
	background-position: bottom;
}

.fondo-nosotros2 {
	width: 100%;
	height: auto;
	min-height: 200px;
	background-image: url(../img/bg-content-80.jpg);
	background-size: cover;
	background-position: top;
}

.fondo-colibri {
	width: 100%;
	height: auto;
	min-height: 200px;
	background-image: url(../img/bg-quienes-somos-native-epicentro-de-una-transformacion.jpg);
	background-size: cover;
	background-position: right;
}

.descripcion-producto {
	width: 100%;
	height: auto;
	min-height: 100px;
	padding: 20px;
	margin: auto;
	border: solid 1px #004263;
	border-radius: 20px;
}

@media only screen and (max-width: 760px) {
  .esconder {
    display: none;
  }
}
@media only screen and (min-width: 759px) {
  .mostrar {
    display: none;
  }
}