/*
  _____ _     _                             _            _ _           ____
 / ____(_)   | |                           | |          | (_)         /___/
| (___  _ ___| |_ ___ _ __ ___   __ _    __| | ___    __| |_ ___  ___ _ __   ___
 \___ \| / __| __/ _ \ '_ ` _ \ / _` |  / _` |/ _ \  / _` | / __|/ _ \ '_ \ / _ \
 ____) | \__ \ ||  __/ | | | | | (_| | | (_| |  __/ | (_| | \__ \  __/ | | | (_) |
|_____/|_|___/\__\___|_| |_| |_|\__,_|  \__,_|\___|  \__,_|_|___/\___|_| |_|\___/

Menú de estilos para los sistemas gubernamentales versión 1.0

1.- Fuentes (utilizada apartir de google fonts)
2.- Paleta de colores
3.- Estilos generales y básicos
4.- Estilos para botónes
5.- Estilos para input, selector, text area y fileinput
6.- Estilos para radios, checkbox y switch
7.- Estilos para cuadros resumen
8.- Estilos para acordeon
9.- Estilos para tarjeta
10.- Estilos para listas
11.- Estilos para buscador
12.- Estilos para tabla
13.- Estilos para tabs
14.- Estilos para tooltips
15.- Estilos para modal
16.- Estilos para footer
17.- Estilos para titulos
18.- Estilos para Login
19.- Estilos para verificador
20.- Estilos para header
21.- Estilos para menu vertical
22.- Estilos para carrusel
23.- Estilos para banner estatico
24.- Estilos para caja navegador
25.- Estilos para breadcrums
26.- Estilos para escritos

 .- Lineamiento para responsivo
*/

/* 1.- Fuentes

    modo de uso:

    se declara con la ruta que proporciona fonts.googleapis.com con "@import url()" ,
    y se declara directamente sobre el body como "font-family: 'Poppins', sans-serif;"
    como viene en el nombre de la familia en la ruta, y posteriormente en la clase donde se
    utilice se declara solamente el peso por ejemplo: "font-weight: 500;" para utilizar los diferentes casos.
*/

/*Fuente para texto en general*/
@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,500&display=swap");
/*Fuente para titulos*/
@import url("https://fonts.googleapis.com/css2?family=Maven+Pro:wght@400;500;600;700;800;900&display=swap");
/*Base para iconos*/
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");
@import url("https://fonts.googleapis.com/icon?family=Material+Icons+Outlined");
/*Segunda base para iconos*/
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css");

/*Fin de Fuentes*/

/*2.- Paleta de colores
    modo de uso:
    se deberán utilizar en cualquier caso en donde existe algun color para sustituir de manera
    más sencilla y llevar un control de los usos en el sistema, se puede utilizar en color,
    background-color, radius, etc de esta manera ejemplo: "background-color: var(--primary-color);"
*/

:root{
    /*Colores base*/
    --color_negro: #15212F;
    --color_blanco: #FFFFFF;
    --color_accent: #15212F;

    /*Colores base institucionales*/

    --color_primario: #15212F; /*azul_institucional*/
    --color_primario_hover: #002E6D; /*azul_institucional_hover*/
    --color_primario_background: #C7CBD0; /*background_seguridad*/
    --color_primario_etiqueta: #2C3743;
    --color_secundario: #AF8C55; /*dorado_institucional*/
    --color_secundario_hover: #C2A982; /*dorado_institucional_hover*/
    --color_dorado_background: #EFE8DD;
    --color_secundario_etiqueta: #D3C0A1;
    --color_gris_background: #EBECF0;
    --color_texto: #1A2E3D;

    /*Colores semánticos*/
    --azul_informativo: #0075C9;
    --verde_exito: #00BC70;
    --rojo_error: #FF4438;
    --amarillo_alerta: #FFA400;
    --azul_informativo_back: #EDF5FF;
    --verde_exito_back: #DEFBE6;
    --rojo_error_back: #FFF1F1;
    --amarillo_alerta_back: #FFF8E1;
    --color_gris_inactivo: #73839C;

    /*administracion*/
    --primario_administracion: #4B858E;
    --hover_administracion: #007481;
    --background_administracion: #dae5e7;
    --etiqueta_administracion: #709ca3;

    /*cultura*/
    --primario_cultura: #8093DC;
    --hover_cultura: #45548F;
    --background_cultura: #E5E8F7;
    --etiqueta_cultura: #9AA8E3;

    /*contraloria*/
    --primario_contraloria: #F7A000;
    --hover_contraloria: #B97800;
    --background_contraloria: #FDECCC;
    --etiqueta_contraloria: #F9B333;

    /*agropecuario*/
    --primario_agropecuario: #FD5F5F;
    --hover_agropecuario: #BE4747;
    --background_agropecuario: #FFDFDF;
    --etiqueta_agropecuario: #FD7F7F;

    /*economia*/
    --primario_economia: #00A6CE;
    --hover_economia: #005367;
    --background_economia: #CFEDF4;
    --etiqueta_economia: #5FCAE1;

    /*educacion*/
    --primario_educacion: #00C4B3;
    --hover_educacion: #009386;
    --background_educacion: #D2F3EE;
    --etiqueta_educacion: #00D1C2;

    /*inclusion*/
    --primario_inclusion: #DF1683;
    --hover_inclusion: #A71162;
    --background_inclusion: #FDD8E4;
    --etiqueta_inclusion: #EA5C9A;

    /*ambiente*/
    --primario_ambiente: #00BC70;
    --hover_ambiente: #008D54;
    --background_ambiente: #D1F2E0;
    --etiqueta_ambiente: #6CD9A7;

    /*movilidad*/
    --primario_movilidad: #00CE7C;
    --hover_movilidad: #009B5D;
    --background_movilidad: #DAF5E3;
    --etiqueta_movilidad: #8DE3AF;

    /*mujeres*/
    --primario_mujeres: #9164CC;
    --hover_mujeres: #533280;
    --background_mujeres: #E9DEF4;
    --etiqueta_mujeres: #A882D7;

    /*participacion*/
    --primario_participacion: #FF6B00;
    --hover_participacion: #86400D;
    --background_participacion: #FFE2C7;
    --etiqueta_participacion: #FF8C1C;

    /*tesoreria*/
    --primario_tesoreria: #FF4438;
    --hover_tesoreria: #B21F15;
    --background_tesoreria: #FFDDD4;
    --etiqueta_tesoreria: #FF725D;

    /*turismo*/
    --primario_turismo: #8A84D6;
    --hover_turismo: #4C4789;
    --background_turismo: #E7E4F6;
    --etiqueta_turismo: #B9B3E7;

    /*trabajo*/
    --primario_trabajo: #FF9015;
    --hover_trabajo: #BF6C10;
    --background_trabajo: #FFE8D2;
    --etiqueta_trabajo: #FFBD7B;

    /*salud*/
    --primario_salud: #00A7E1;
    --hover_salud: #007DA9;
    --background_salud: #D7ECF8;
    --etiqueta_salud: #44B8E7;

    /*seguridad*/
    --primario_seguridad: #051C2C;
    --hover_seguridad: #030E16;
    --background_seguridad: #C7CBD0;
    --etiqueta_seguridad: #616D79;

    /*Gabinete Buen Gobierno*/
    --primario_buen_gobierno: #F7A000;
    --hover_buen_gobierno: #DA8824;
    --background_buen_gobierno: #FCECD9;
    --etiqueta_buen_gobierno: #FFC27A;

    /*Gabinete Igualdad*/
    --primario_igualdad: #410099;
    --hover_igualdad: #230871;
    --background_igualdad: #DCDAE9;
    --etiqueta_igualdad: #8A84D6;

    /*Gabinete Riqueza*/
    --primario_riqueza: #006E43;
    --hover_riqueza: #005640;
    --background_riqueza: #CFDDBB;
    --etiqueta_riqueza: #348F41;

    /*Dependencias y/o diseño en baja*/
    --primario_baja: var(--color_gris_inactivo);
    --hover_baja: #C3C9D4;
    --background_baja: var(--color_gris_background);
    --etiqueta_baja: #9BA6B8;

    /*Nuevo león Travel*/
    --primario_nl_travel: #1262FF;
    --hover_nl_travel: #FF7175;
    --background_nl_travel: #DAE2FF;
    --etiqueta_nl_travel: #071C49;

    /*Agua y drenaje*/
    --primario_agua_drenaje: #003973;
    --hover_agua_drenaje: #3898EC;
    --background_agua_drenaje: #DEEEFC;
    --etiqueta_agua_drenaje: #1C68AF;

}

.nl_travel:root,
:root .nl_travel {
  --color_primario: var(--primario_nl_travel);
  --color_primario_hover: var(--hover_nl_travel);
  --color_primario_background: var(--background_nl_travel);
  --color_primario_etiqueta: var(--etiqueta_nl_travel);
}

.dependencia:root,
:root .dependencia {
  --color_primario: var(--primario_baja);
  --color_primario_hover: var(--hover_baja);
  --color_primario_background: var(--background_baja);
  --color_primario_etiqueta: var(--etiqueta_baja);
}

.administracion:root,
:root .administracion {
  --color_primario: var(--primario_administracion);
  --color_primario_hover: var(--hover_administracion);
  --color_primario_background: var(--background_administracion);
  --color_primario_etiqueta: var(--etiqueta_administracion);
}

.cultura:root,
:root .cultura {
  --color_primario: var(--primario_cultura);
  --color_primario_hover: var(--hover_cultura);
  --color_primario_background: var(--background_cultura);
  --color_primario_etiqueta: var(--etiqueta_cultura);
}

.contraloria:root,
:root .contraloria {
  --color_primario: var(--primario_contraloria);
  --color_primario_hover: var(--hover_contraloria);
  --color_primario_background: var(--background_contraloria);
  --color_primario_etiqueta: var(--etiqueta_contraloria);
}

.agropecuario:root,
:root .agropecuario {
  --color_primario: var(--primario_agropecuario);
  --color_primario_hover: var(--hover_agropecuario);
  --color_primario_background: var(--background_agropecuario);
  --color_primario_etiqueta: var(--etiqueta_agropecuario);
}

.economia:root,
:root .economia {
  --color_primario: var(--primario_economia);
  --color_primario_hover: var(--hover_economia);
  --color_primario_background: var(--background_economia);
  --color_primario_etiqueta: var(--etiqueta_economia);
}

.educacion:root,
:root .educacion {
  --color_primario: var(--primario_educacion);
  --color_primario_hover: var(--hover_educacion);
  --color_primario_background: var(--background_educacion);
  --color_primario_etiqueta: var(--etiqueta_educacion);
}

.inclusion:root,
:root .inclusion {
  --color_primario: var(--primario_inclusion);
  --color_primario_hover: var(--hover_inclusion);
  --color_primario_background: var(--background_inclusion);
  --color_primario_etiqueta: var(--etiqueta_inclusion);
}

.ambiente:root,
:root .ambiente {
  --color_primario: var(--primario_ambiente);
  --color_primario_hover: var(--hover_ambiente);
  --color_primario_background: var(--background_ambiente);
  --color_primario_etiqueta: var(--etiqueta_ambiente);
}

.movilidad:root,
:root .movilidad {
  --color_primario: var(--primario_movilidad);
  --color_primario_hover: var(--hover_movilidad);
  --color_primario_background: var(--background_movilidad);
  --color_primario_etiqueta: var(--etiqueta_movilidad);
}

.mujeres:root,
:root .mujeres {
  --color_primario: var(--primario_mujeres);
  --color_primario_hover: var(--hover_mujeres);
  --color_primario_background: var(--background_mujeres);
  --color_primario_etiqueta: var(--etiqueta_mujeres);
}
ll
.participacion:root,
:root .participacion {
  --color_primario: var(--primario_participacion);
  --color_primario_hover: var(--hover_participacion);
  --color_primario_background: var(--background_participacion);
  --color_primario_etiqueta: var(--etiqueta_participacion);
}

.tesoreria:root,
:root .tesoreria {
  --color_primario: var(--primario_tesoreria);
  --color_primario_hover: var(--hover_tesoreria);
  --color_primario_background: var(--background_tesoreria);
  --color_primario_etiqueta: var(--etiqueta_tesoreria);
}

.turismo:root,
:root .turismo {
  --color_primario: var(--primario_turismo);
  --color_primario_hover: var(--hover_turismo);
  --color_primario_background: var(--background_turismo);
  --color_primario_etiqueta: var(--etiqueta_turismo);
}

.trabajo:root,
:root .trabajo {
  --color_primario: var(--primario_trabajo);
  --color_primario_hover: var(--hover_trabajo);
  --color_primario_background: var(--background_trabajo);
  --color_primario_etiqueta: var(--etiqueta_trabajo);
}

.salud:root,
:root .salud {
  --color_primario: var(--primario_salud);
  --color_primario_hover: var(--hover_salud);
  --color_primario_background: var(--background_salud);
  --color_primario_etiqueta: var(--etiqueta_salud);
}

.seguridad:root,
:root .seguridad {
  --color_primario: var(--primario_seguridad);
  --color_primario_hover: var(--hover_seguridad);
  --color_primario_background: var(--background_seguridad);
  --color_primario_etiqueta: var(--etiqueta_seguridad);
}

.gobierno:root,
:root .gobierno,
.default:root,
:root .default{
  --color_primario: var(--color_secundario);
  --color_primario_hover: var(--color_secundario_hover);
  --color_primario_background: var(--color_dorado_background);
  --color_primario_etiqueta: var(--color_secundario_etiqueta);
}

/*Colores para gabinetes*/
.buen_gobierno:root,
:root .buen_gobierno {
  --color_primario: var(--primario_buen_gobierno);
  --color_primario_hover: var(--hover_buen_gobierno);
  --color_primario_background: var(--background_buen_gobierno);
  --color_primario_etiqueta: var(--etiqueta_buen_gobierno);
}

.igualdad:root,
:root .igualdad {
  --color_primario: var(--primario_igualdad);
  --color_primario_hover: var(--hover_igualdad);
  --color_primario_background: var(--background_igualdad);
  --color_primario_etiqueta: var(--etiqueta_igualdad);
}

.riqueza:root,
:root .riqueza {
  --color_primario: var(--primario_riqueza);
  --color_primario_hover: var(--hover_riqueza);
  --color_primario_background: var(--background_riqueza);
  --color_primario_etiqueta: var(--etiqueta_riqueza);
}

/*Colores para dependencias descentralizadas*/
.agua_drenaje:root,
:root .agua_drenaje {
  --color_primario: var(--primario_agua_drenaje);
  --color_primario_hover: var(--hover_agua_drenaje);
  --color_primario_background: var(--background_agua_drenaje);
  --color_primario_etiqueta: var(--etiqueta_agua_drenaje);
}

/*Fin de Paleta de colores*/

/*3.- Estilos generales y básicos*/
:root{
    --unidad:8px;
    --redondez_base: 4px; /*Escala para puntas de botones e input*/
    --alto_base: 48px; /*Alto general para botónes e input*/
    --borde_base: 2px; /*Escala para los bordes de manera general*/
    --unidad_base: calc(var(--unidad)* 4); /*Unidad base para separaciones, margenes y rellenos*/
    --ancho_base: 1440px; /*Unidad utilizada para limitar lo maximo que puede crecer un contenedor*/
    --alto_verificador: 32px; /*Medida estandar para el verificador y sus aplicaciones*/
    --alto_navegador: 64px; /*Medida estandar para el navegador*/
    --relleno_fila: 0px 80px; /*Unidad para rellenar los elementos en fila*/
    --ancho_menu: 300px; /*Unidad para el ancho del menú vertical*/

    /*Reglas para titulos*/
    --titulo_escala:48px;
    --titulo_interlineado: 52px;
    --h1_escala: 42px;
    --h1_interlineado: 46px;
    --h2_escala: 32px;
    --h2_interlineado: 36px;
    --h3_escala: 24px;
    --h3_interlineado: 30px;
    --h4_escala: 20px;
    --h4_interlineado: 24px;
    --h5_escala: 16px;
    --h5_interlineado: 20px;
    --h6_escala: 13px;
    --h6_interlineado: 20px;
    --etiqueta_escala: 10px;
    --etiqueta_interlineado: 14px;

    /*Estilos para elevaciones*/
    --primera_sombra: rgba(0, 0, 0, 0.3);
    --segunda_sombra: rgba(0, 0, 0, 0.15);
    --elevacion_1: 0px 1px 2px var(--primera_sombra), 0px 1px 3px 1px var(--segunda_sombra);
    --elevacion_2: 0px 1px 2px var(--primera_sombra), 0px 2px 6px 2px var(--segunda_sombra);
    --elevacion_3: 0px 1px 3px var(--primera_sombra), 0px 4px 8px 3px var(--segunda_sombra);
    --elevacion_4: 0px 2px 3px var(--primera_sombra), 0px 6px 10px 4px var(--segunda_sombra);
    --elevacion_5: 0px 4px 4px var(--primera_sombra), 0px 8px 12px 6px var(--segunda_sombra);
    --elevacion_dorada: 0px 2px 6px 2px rgba(194, 169, 130, 0.3), 0px 1px 2px rgba(175, 140, 85, 0.15);

}

html,
body {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 400;
    font-size: var(--h6_escala);
    line-height: var(--h6_interlineado);
    /* height: 100%; */
    height: auto;
    min-height: 100%;
    width: 100%;
    color: var(--color_negro);
    margin: 0px;
    scroll-behavior: smooth;
}

* {
  text-rendering: optimizeLegibility;
  box-sizing: border-box;
}

.titulo{
    font-family: 'Maven Pro', sans-serif !important;
    font-size: var(--titulo_escala);
    line-height: var(--titulo_interlineado);
    font-weight: 600;
    color: inherit;
}

h1{
    font-family: 'Maven Pro', sans-serif !important;
    font-size: var(--h1_escala);
    line-height: var(--h1_interlineado);
    font-weight: 600;
    color: inherit;
}

h2{
    font-family: 'Maven Pro', sans-serif !important;
    font-size: var(--h2_escala);
    line-height: var(--h2_interlineado);
    font-weight: 600;
    color: inherit;
}

h3{
    font-family: 'Maven Pro', sans-serif !important;
    font-size: var(--h3_escala);
    line-height: var(--h3_interlineado);
    font-weight: 600;
    color: inherit;
}

h4{
    font-family: 'Maven Pro', sans-serif !important;
    font-size: var(--h4_escala);
    line-height: var(--h4_interlineado);
    font-weight: 600;
    color: inherit;
}

h5{
    font-family: 'Maven Pro', sans-serif !important;
    font-size: var(--h5_escala);
    line-height: var(--h5_interlineado);
    font-weight: 600;
    color: inherit;
}

h6{
  font-family: 'Maven Pro', sans-serif !important;
  font-size: var(--h6_escala);
  line-height: var(--h6_interlineado);
  font-weight: 600;
  color: inherit;
}

hr{
  width: 100%;
  margin:  var(--unidad_base) 0px 0px;
  opacity: 1;
  color: var(--color_gris_background);
}

p{
  text-align: justify;
}

.etiqueta{
    font-size: var(--etiqueta_escala);
    line-height: var(--etiqueta_interlineado);
}

a,
a.link {
  color: var(--color_primario);
  text-decoration: none;
  font-weight: 500;
  position: relative;
  cursor: pointer;
}

a.link::after{
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    background-position: bottom left;
    background-repeat: no-repeat;
    background-image: linear-gradient( transparent calc(100% - 1px), var(--color_primario) 1px ), linear-gradient( transparent calc(100% - 1px), var(--color_primario_background) 1px );
    background-size: 0% 6px, 100% 6px;
    -webkit-transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1);
    -moz-transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1);
}

a:hover,
a.link:hover {
  color: var(--color_primario_hover);
  text-decoration: none;
  transition: all 0.2s ease-in-out;
}

a.link:hover::after {
  background-size: 100% 6px, 100% 6px;
}

a.link:visited {
  color: var(--color_primario_hover);
}

.link.tiene_flecha {
  position: relative;
}

.link.tiene_flecha::before{
  content: '\e5e1';
  font-family: 'Material icons';
  position: absolute;
  font-size: inherit;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  left: 100%;
  height: 100%;
  bottom: -1px;
  color: inherit;
  transition: all 0.3s ease-in-out;
}

.link.tiene_flecha:hover:before {
  margin-left: 6px;
  transition: all 0.3s ease-in-out;
}

.link.es_externo {
  position: relative;
}

.link.es_externo::before{
  content: '\e5d8';
  font-family: 'Material icons';
  position: absolute;
  font-size: larger;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  left: 100%;
  height: 100%;
  bottom: -1px;
  margin-left: 2px;
  color: inherit;
  transform: rotate(45deg);
  transition: all 0.3s ease-in-out;
}

.link.es_externo:hover:before {
  margin-left: 4px;
  margin-bottom: 2px;
  transition: all 0.3s ease-in-out;
}

.link > span{
  position: relative;
  bottom: -5px;
  font-size: large;
  margin-right: 4px;
}

.es_label {
  display: flex;
  font-size: var(--h5_escala);
  line-height: var(--h5_interlineado);
  font-weight: 600;
  margin-top: 32px;
  margin-bottom: 16px;
}

.elemento_forma .es_label {
  margin-bottom: 8px;
}

.es_horizontal {
    width: 100% !important;
  display: flex;
  flex-direction: row;
}

.es_vertical {
  display: flex;
  flex-direction: column;
}

.es_enlace {
  background: transparent;
  color: var(--color_primario);
  border: none;
  height: min-content;
  padding: 0px;
}

.es_invisible{
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
}

.caja_etiquetas {
  padding: 0px 4px;
}

.caja_etiquetas .es_etiqueta {
  margin-top: 4px;
}

.es_etiqueta {
  min-width: 150px;
  cursor: pointer;
  display: inline-block;
  text-align: center;
  border: 1px solid var(--color_secundario);
  padding: 8px 32px;
  font-size: 13px;
  line-height: 1.5;
  border-radius: var(--redondez_base);
  color: var(--color_secundario);
  background-color: var(--color_dorado_background);
}

*:hover > .es_etiqueta {
  background-color: var(--color_secundario);
  color: var(--color_blanco);
}

*:focus > .es_etiqueta,
*:active > .es_etiqueta {
  background-color: var(--azul_informativo_back);
  color: var(--azul_informativo);
  border-color: var(--azul_informativo);
}

.es_divisor {
  margin-top: 8px;
  margin-bottom: 8px;
  background: transparent;
  position: relative;
}

.es_divisor span {
  position: relative;
  background-color: var(--color_blanco);
  color: var(--color_gris_inactivo);
  padding-right: 8px;
  padding-left: 8px;
}

.es_divisor::before{
    content: '';
    position: absolute;
    left: 0px;
    right: 0px;
    top: 50%;
    width: 100%;
    height: 1px;
    background-color: var(--color_gris_inactivo);
}

.elevacion_1 {
  box-shadow: var(--elevacion_1);
}

.elevacion_2 {
  box-shadow: var(--elevacion_2);
}

.elevacion_3 {
  box-shadow: var(--elevacion_3);
}

.elevacion_4 {
  box-shadow: var(--elevacion_4);
}

.elevacion_5 {
  box-shadow: var(--elevacion_5);
}

.elevacion_dorada {
  box-shadow: var(--elevacion_dorada);
}

.margen_base {
  margin: var(--unidad_base);
}

.relleno_base {
  padding: var(--unidad_base);
}

::-webkit-scrollbar-track {
  /* -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); */
    border-radius: 0px;
    background-color: #F5F5F5;
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb {
  border-radius: 0px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: var(--color_dorado_background);
}

#menu_vertical ::-webkit-scrollbar {
  width: 4px;
}

form {
  display: inline-block;
}

.contenedor_general{
    margin: var(--unidad_base) auto;
    height: auto;
    padding: var(--relleno_fila);
    max-width: var(--ancho_base);
    min-height: calc(80vh - 231px);

    /* min-height: calc(100vh - 328px); */
    /* padding-left: var(--unidad_base);
    padding-right: var(--unidad_base); */
}

.contenedor_general > *:first-child {
    margin-top: 0px !important;
}

.area_boton {
  width: 100%;
  display: inline-flex;
  justify-content: center;
  margin: var(--unidad_base) 0px;
}

.tiene_fondo_gris{
  position: relative;
  display: flex;
  justify-content: center;
}

.tiene_fondo_gris::before {
  content: '';
  background-color: var(--color_gris_background);
  position: absolute;
  width: 99.6vw;
  height: calc(100% + 32px);
  z-index: -1;
}

/*Fin de Estilos generales y básicos*/

/*4.- Estilos para botónes*/

.boton {
  cursor: pointer;
  min-height: var(--alto_base);
  width: auto;
  padding: 10px 32px;
  font-size: var(--h5_escala);
  line-height: 1.5;
  font-weight: 600;
  border: var(--borde_base) solid transparent;
  border-radius: var(--redondez_base);
  display: inline-block;
  transition: all 0.2s ease-in-out;
}

button.boton {
  font-family: inherit;
  /* line-height: inherit; */
}

.boton:focus,
.boton:focus-visible {
  outline: none;
  border: var(--borde_base) solid var(--color_secundario);
}

.boton:hover {
  border: var(--borde_base) solid transparent;
}

.boton + .boton,
.modal-footer .boton + .boton {
  margin-left: 16px;
}

.boton .material-icons,
.boton .material-icons-outlined {
  margin-left: -8px;
  margin-right: 8px;
  font-size: 24px;
  height: 0px;
  display: inline-flex;
  vertical-align: middle;
  align-items: center;
}

.boton i.bi::before{
  font-size: 19px;
  transform: translateY(2px);
}

.boton.solo_icono {
  width: 48px;
  padding-right: 0px;
  padding-left: 0px;
  text-align: center;
}

.boton.solo_icono .material-icons {
  margin-left: 0px;
  margin-right: 0px;
}

.boton_primario {
  color: var(--color_blanco);
  background-color: var(--color_primario);
}

.boton_primario:hover,
.boton_primario:focus,
.boton_primario:focus-visible {
  color: var(--color_blanco);
  background-color: var(--color_primario_hover);
  transition: all 0.2s ease-in-out;
}

.boton_secundario {
  color: var(--color_secundario);
  background-color: var(--color_blanco);
  border: var(--borde_base) solid var(--color_secundario);
}

.boton_secundario:hover,
.boton_secundario:focus,
.boton_secundario:focus-visible {
  color: var(--color_blanco);
  background-color: var(--color_secundario);
  transition: all 0.2s ease-in-out;
}

.boton_terciario {
  color: var(--color_primario_hover);
  background-color: var(--color_gris_background);
}

.boton_terciario:hover,
.boton_terciario:focus,
.boton_terciario:focus-visible {
  background-color: var(--color_primario_background);
  transition: all 0.2s ease-in-out;
}

.boton.es_inactivo {
  cursor: default;
  background-color: var(--color_gris_background);
  color: var(--color_gris_inactivo);
  border: var(--borde_base) solid transparent;
  opacity: 0.5;
}

/*Fin de Estilos para botónes*/

/*5.- Estilos para input, selector y text area*/

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 50px white inset !important;
}

input[type="email"],
input[type="number"],
input[type="password"],
input[type="reset"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="url"],
input[type="date"],
select {
  height: var(--alto_base);
  border-radius: var(--redondez_base);
  font-size: var(--h5_escala);
  padding: 16px;
  border: 1.5px solid var(--color_accent);
}

textarea {
  border-radius: var(--redondez_base);
  font-size: var(--h5_escala);
  padding: 16px;
  border: 1.5px solid var(--color_accent);
}

input.form-control {
  height: var(--alto_base);
  border-radius: var(--redondez_base);
  font-size: var(--h5_escala);
  padding: 16px;
  border: 1.5px solid var(--color_accent);
}

input.form-control:hover {
  border: 1.5px solid var(--color_secundario);
}

input.form-control:focus {
  border: 1.5px solid var(--color_secundario);
  box-shadow: var(--elevacion_dorada);
}

.form-label {
  font-weight: 600;
  font-size: var(--h5_escala);
  line-height: var(--h5_interlineado);
  margin-top: 32px;
  margin-bottom: 8px;
}

input.form-control + .form-label {
  margin: 0px 10px !important;
  padding: 0px 6px;
  color: var(--color_gris_inactivo);
  font-weight: 400;
  position: absolute;
  z-index: 10;
  transform: translateY(16px);
  transition: 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

input.form-control:focus + .form-label,
input.form-control:not(:placeholder-shown) + .form-label {
  transform: translateY(-50%);
  background-color: var(--color_blanco);
  padding: 0px 6px;
  margin: 0px 10px !important;
  font-size: 12px;
}

/* Lista de de selectores con soporte a varios navegadores para el cambio de color del placeholder */
::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: var(--color_gris_inactivo) !important;
}
:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: var(--color_gris_inactivo) !important;
  opacity: 1;
}
::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: var(--color_gris_inactivo) !important;
  opacity: 1;
}
:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: var(--color_gris_inactivo) !important;
}
::-ms-input-placeholder {
  /* Microsoft Edge */
  color: var(--color_gris_inactivo) !important;
}
::placeholder {
  /* Most modern browsers support this now. */
  color: var(--color_gris_inactivo) !important;
}

select.form-select {
  color: var(--color_gris_inactivo);
  height: var(--alto_base);
  border-radius: var(--redondez_base);
  font-size: var(--h5_escala);
  padding-left: 16px;
  border: 1.5px solid var(--color_accent);
}

select.form-select:hover {
  border: 1.5px solid var(--color_secundario);
}

select.form-select:focus {
  border: 1.5px solid var(--color_secundario);
  box-shadow: var(--elevacion_dorada);
}

.input-group input[type="date"] {
  position: initial;
  margin-right: 1px;
  cursor: pointer;
}

.input-group input[type="date"]::-webkit-calendar-picker-indicator {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 25%;
  right: 0;
  bottom: 0;
  width: auto;
  height: auto;
  color: transparent;
  background: transparent;
}

.input-group input[type="date"] ~ label.input-group-text {
  margin-bottom: 0px;
  background-color: var(--color_blanco);
  color: var(--color_accent);
  border: 1.5px solid var(--color_negro);
  border-left: 1px;
  cursor: pointer;
}

.input-group:hover input[type="date"] ~ label.input-group-text {
  border: 1.5px solid var(--color_secundario);
  border-left: 0px;
}

.input-group input[type="date"]:focus ~ label.input-group-text {
  border: 1.5px solid var(--color_secundario);
  border-left: 0px;
  box-shadow: var(--elevacion_dorada);
}

.form-label + input[type="file"] {
  line-height: 40px;
  padding: 3px 8px;
}

.input-group input[type="file"]::-webkit-file-upload-button {
  display: none;
}

.input-group input[type="file"]::file-selector-button {
  display: none;
}

.input-group input[type="file"] {
  padding: 12px 16px;
  line-height: var(--h6_interlineado);
}

.input-group input[type="file"] ~ label.input-group-text {
  margin-bottom: 0px;
  background-color: var(--color_blanco);
  color: var(--color_accent);
  border: 1.5px solid var(--color_negro);
  border-left: 0px;
  cursor: pointer;
}

.input-group:hover input[type="file"] ~ label.input-group-text {
  border: 1.5px solid var(--color_secundario);
  border-left: 0px;
}

.input-group input[type="file"]:focus ~ label.input-group-text {
  border: 1.5px solid var(--color_secundario);
  border-left: 0px;
  box-shadow: var(--elevacion_dorada);
  z-index: 3;
}

.input-group * ~ .input-group-text {
  margin-bottom: 0px;
  background-color: var(--color_blanco);
  color: var(--color_accent);
  border: 1.5px solid var(--color_negro);
  border-left: 0px;
  cursor: pointer;
}

.input-group:hover * ~ .input-group-text {
  border: 1.5px solid var(--color_secundario);
  border-left: 0px;
}

.input-group *:focus ~ .input-group-text {
  border: 1.5px solid var(--color_secundario);
  border-left: 0px;
  box-shadow: var(--elevacion_dorada);
  z-index: 3;
}

textarea.form-control {
  border-radius: var(--redondez_base);
  font-size: var(--h5_escala);
  padding: 16px;
  border: 1.5px solid var(--color_accent);
}

textarea.form-control:hover {
  border: 1.5px solid var(--color_secundario);
}

textarea.form-control:focus {
  border: 1.5px solid var(--color_secundario);
  box-shadow: var(--elevacion_dorada);
}
/*Fin de Estilos para input, selector y text area*/

/*6.- Estilos para radios, checkbox y swtich*/

input[type="radio"] {
  -ms-transform: scale(1.8); /* IE 9 */
  -webkit-transform: scale(1.8); /* Chrome, Safari, Opera */
  transform: scale(1.8);
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 15px;
  margin-left: 15px;
}

/* input[type='radio']::after {
    content: '';
    background-color: transparent;
    animation: background-color .4s linear;
} */

input[type="radio"]::before {
  content: "";
  width: 84%;
  height: 84%;
  border-radius: 15px;
  position: absolute;
  background-color: var(--color_blanco);
  transition: background-color 0.2s ease-in;
}

input[type="radio"]:checked::before {
  width: 100%;
  height: 100%;
  background-color: var(--color_secundario);
  transition: background-color 0.2s ease-in;
}

input[type="radio"]:checked::after {
  content: "";
  width: 40%;
  height: 40%;
  border-radius: 15px;
  position: absolute;
  background-color: var(--color_blanco);
}

.caja_radios {
  margin-bottom: 32px;
  margin-top: 32px;
}

.caja_radios .radio,
.caja_radios input[type="radio"] {
  cursor: pointer;
  margin-left: 2px;
  margin-bottom: 8px;
}

.caja_radios .radio {
  display: block;
  width: max-content;
}

.caja_radios .radio:first-of-type:nth-last-of-type(2),
.caja_radios .radio:first-of-type:nth-last-of-type(2) ~ .radio {
  display: inline-block;
  width: auto;
  margin-bottom: 0px;
}

.caja_radios .radio:first-of-type:nth-last-of-type(2) ~ .radio input[type='radio']{
    margin-left: 15px;
}

input[type="checkbox"] {
  -ms-transform: scale(1.8); /* IE 9 */
  -webkit-transform: scale(1.8); /* Chrome, Safari, Opera */
  transform: scale(1.8);
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 15px;
  margin-left: 15px;
  accent-color: var(--color_secundario);
  transition: accent-color 0.2s ease-in;
}

.caja_checkbox {
  margin-bottom: 32px;
  margin-top: 32px;
}

.caja_checkbox .checkbox,
.caja_checkbox input[type="checkbox"] {
  cursor: pointer;
  margin-left: 2px;
  margin-bottom: 8px;
}

.caja_checkbox .checkbox {
  display: block;
  width: max-content;
}

.caja_checkbox .checkbox:first-of-type:nth-last-of-type(2),
.caja_checkbox .checkbox:first-of-type:nth-last-of-type(2) ~ .checkbox {
  display: inline-block;
  width: auto;
  margin-bottom: 0px;
}

.caja_checkbox .checkbox:first-of-type:nth-last-of-type(2) ~ .checkbox input[type='checkbox']{
    margin-left: 15px;
}

/* Estilos para elemento switch */
.switch {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 24px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: transparent;
  border: 1.5px solid #767676;
  border-radius: 34px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: calc(100% - 4px);
  width: calc(50% - 4px);
  left: 2px;
  bottom: 2px;
  border-radius: 50%;
  background-color: var(--color_gris_inactivo);
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

input:checked + .slider {
  background-color: var(--color_secundario);
  border: 1.5px solid var(--color_secundario);
}

input:focus + .slider {
  box-shadow: 0 0 1px var(--color_secundario);
}

input:checked + .slider:before {
  background-color: var(--color_blanco);
  -webkit-transform: translateX(22px);
  -ms-transform: translateX(22px);
  transform: translateX(22px);
}

/*Fin de Estilos para radios, checkbox y switch*/

/*7.- Estilos para cuadros resumen*/

.contenedor_resumen {
  background-color: var(--azul_informativo_back);
  border: 1px solid var(--azul_informativo);
  border-radius: var(--redondez_base);
  padding: 32px;
}

.contenedor_resumen > * {
  margin-top: 0px;
  margin-bottom: 16px;
}

.contenedor_resumen > *:last-of-type {
  margin-bottom: 0px;
}

.contenedor_resumen > * + * {
  margin-top: 16px;
}

.contenedor_resumen > ul {
  padding-left: 16px;
  margin-bottom: 0px;
}

.contenedor_resumen p:last-of-type {
  margin-bottom: 0px;
}

.contenedor_resumen.es_error {
  position: relative;
  background-color: var(--rojo_error_back);
  border: 1px solid var(--rojo_error);
  margin-bottom: 24px;
  padding: 0px 32px;
  height: 0px;
  opacity: 0;
  transition: all ease-in-out 0.2s;
}

.contenedor_resumen.es_error.es_visible {
  padding: 16px 32px;
  height: auto;
  opacity: 1;
  transition: all ease-in-out 0.2s;
}

.contenedor_resumen.es_success {
  position: relative;
  background-color: var(--verde_exito_back);
  border: 1px solid var(--verde_exito);
  margin-bottom: 24px;
  padding: 0px 32px;
  height: 0px;
  opacity: 0;
  transition: all ease-in-out 0.2s;
}

.contenedor_resumen.es_success.es_visible {
  padding: 16px 32px;
  height: auto;
  opacity: 1;
  transition: all ease-in-out 0.2s;
}

.contenedor_resumen .material-icons {
  position: absolute;
  top: 1px;
  right: 8px;
  cursor: pointer;
  font-size: 18px;
}

/*Fin de Estilos para cuadros resumen*/

/*8.- Estilos para acordeon*/

.caja_acordeon {
  width: 100%;
}

.accordion.caja_acordeon .accordion-item {
  border-radius: var(--redondez_base);
  background-color: var(--color_gris_background);
  border: 0px;
}

.caja_acordeon .accordion-item:after {
  border-color: transparent !important;
}

.caja_acordeon .accordion-item::before {
  box-shadow: none;
}

.caja_acordeon .accordion-item + .accordion-item {
  margin-top: 16px;
}

.caja_acordeon .accordion-header {
  height: var(--alto_base);
  min-height: var(--alto_base);
}

.caja_acordeon .accordion-header.accordion-button {
  height: auto;
  min-height: var(--alto_base);
  padding: 8px 32px;
}

.caja_acordeon .accordion-header.accordion-button[aria-expanded="true"] {
  box-shadow: var(--elevacion_3);
  position: relative;
  z-index: 0;
}

.caja_acordeon .accordion-header.accordion-button[aria-expanded="true"] + .accordion-collapse .accordion-body,
.caja_acordeon .accordion-header.accordion-button[aria-expanded="true"] + .accordion-body {
    box-shadow: var(--elevacion_1);
    position: relative;
}

.caja_acordeon .accordion-button {
  height: 100%;
  padding: 0rem 32px;
  background-color: transparent;
  font-weight: 600;
  border: 2px solid transparent;
  font-size: var(--h5_escala);
  line-height: var(--h5_interlineado);
}

.caja_acordeon .accordion-button::after {
  background-image: none;
  font-family: "Material icons";
  content: "\e5cf";
  color: var(--color_blanco);
  background-color: var(--color_secundario);
  border-radius: 50%;
  width: auto;
  height: auto;
  font-weight: 500;
  font-size: 24px;
  line-height: 1;
}

.caja_acordeon .accordion-button:not(.collapsed)::after {
  background-image: none;
}

.caja_acordeon .accordion-button:focus {
  border-color: transparent;
  box-shadow: none;
  border-radius: var(--redondez_base);
  border: 2px solid var(--color_secundario);
  outline: none;
}

.caja_acordeon .accordion-button:focus::before {
  opacity: 0;
}

.caja_acordeon .accordion-button[aria-expanded="true"] {
  border-radius: var(--redondez_base) var(--redondez_base) 0px 0px;
  color: var(--color_secundario);
  background-color: var(--color_dorado_background);
  border: 2px solid transparent;
  box-shadow: none;
}

.caja_acordeon .accordion-button:hover {
  border-radius: var(--redondez_base);
  color: var(--color_secundario);
  background-color: var(--color_dorado_background);
}

.caja_acordeon .accordion-button[aria-expanded="true"]:hover {
  border-radius: var(--redondez_base) var(--redondez_base) 0px 0px;
}

.caja_acordeon .accordion-button[aria-expanded="true"]:focus {
  border: 2px solid transparent;
}

.caja_acordeon
  .accordion-item:last-of-type
  .accordion-button[aria-expanded="false"] {
  border-radius: var(--redondez_base);
}

.caja_acordeon .accordion-body {
  padding: 32px;
  background-color: var(--color_blanco);
  border-radius: 0px 0px var(--redondez_base) var(--redondez_base);
  /* box-shadow: var(--elevacion_3);
    position: relative; */
}

.caja_acordeon .accordion-body > div {
  padding: 0px;
}

.accordion-header::selection {
  background-color: black;
}

/*Fin de Estilos para acordeon*/

/*9.- Estilos para tarjeta*/

.caja_tarjeta {
  position: relative;
  /* width: fit-content; */
  width: 100%;
  height: auto;
  background-color: var(--color_blanco);
  border-radius: var(--redondez_base);
  box-shadow: var(--elevacion_1);
}

/* .caja_tarjeta:not([class*="col"]){
    width: 100%;
} */

.caja_tarjeta .imagen_tarjeta {
  min-height: 100px;
  overflow: hidden;
  /* background-color: var(--color_gris_background); */
  background-color: transparent;
}

.caja_tarjeta .imagen_tarjeta > * {
  width: 100%;
  border-radius: var(--redondez_base) var(--redondez_base) 0px 0px;
  transition: all ease-in-out 0.2s;
}

.caja_tarjeta .cuerpo_tarjeta {
  padding: 32px;
  transition: all ease-in-out 0.2s;
}

.caja_tarjeta .cuerpo_tarjeta p .material-icons{
  position: relative;
  bottom: -5px;
  font-size: 16px;
}

.caja_tarjeta .cuerpo_tarjeta .seccion_titulo{
  margin-top: 0px;
}

.caja_tarjeta .cuerpo_tarjeta .seccion_titulo.es_vertical{
  align-items: flex-start;
}

.caja_tarjeta h2.titulo_tarjeta {
  font-weight: 700;
}

.caja_tarjeta .titulo_tarjeta{
  margin-bottom: 16px;
}

.caja_tarjeta .texto_tarjeta {
  margin-top: 16px;
  margin-bottom: 16px;
}

.caja_tarjeta.es_horizontal .imagen_tarjeta > * {
  height: 100%;
  border-radius: var(--redondez_base) 0px 0px var(--redondez_base);
}

.caja_tarjeta.es_horizontal.redonda_horizontal .imagen_tarjeta > img{
  position: absolute;
  object-fit: cover;
  height: 100%;
  width: 100%;
}

.caja_tarjeta.apartado_tarjeta {
  height: 136px;
  max-width: -moz-fit-content;
  max-width: fit-content;
}

.caja_tarjeta.apartado_tarjeta .imagen_tarjeta {
  background-color: transparent;
  padding: 32px 0px 32px 32px;
  height: auto;
}

.caja_tarjeta.apartado_tarjeta .cuerpo_tarjeta {
  padding: 32px 32px 32px 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.caja_tarjeta .texto_tarjeta {
  font-weight: 400;
  font-size: var(--h5_escala);
  line-height: var(--h5_interlineado);
}

/*Estilos para tarjetas redondas*/
.caja_tarjeta.es_redonda {
  border-radius: 60px 4px 60px 4px;
}

.caja_tarjeta.es_redonda:hover .imagen_tarjeta * {
  transform: scale(1.05);
  transition: all ease-in-out 0.2s;
}

.caja_tarjeta.es_redonda:hover .cuerpo_tarjeta {
  padding-top: 35px;
  padding-bottom: 35px;
  margin-top: -66px;
  transition: all ease-in-out 0.2s;
}

.caja_tarjeta.es_redonda .imagen_tarjeta {
  position: relative;
  z-index: 0;
  border-radius: 60px 4px 0px 0px;
}

.caja_tarjeta.es_redonda .cuerpo_tarjeta {
  margin-top: -60px;
  position: relative;
  z-index: 10;
  background: var(--color_blanco);
  border-radius: 60px 0px 60px 4px;
}

/*Estilos para tarjetas con mascara*/

.caja_tarjeta.es_horizontal.tiene_mascara {
  box-shadow: none;
  border-radius: var(--redondez_base);
  border: 1px solid var(--color_gris_background);
  margin-top: var(--unidad_base);
}

.caja_tarjeta.es_vertical.tiene_mascara {
  width: 100%;
  box-shadow: none;
  border-radius: var(--redondez_base);
  border: 1px solid var(--color_gris_background);
}

.tiene_mascara svg {
  width: 100%;
  height: 100%;
}

.tiene_mascara svg image{
    position: absolute;
    height: 100%;
    width: auto;
}

.caja_tarjeta.es_horizontal.tiene_mascara svg{
    position: absolute;
    width: 100%;
    height: 100%;
}

.caja_tarjeta.es_horizontal.tiene_mascara .imagen_tarjeta{
    position: relative;
    background-color: transparent;
}

#mascara_horizontal path{
  transform: scale(0.89, 0.90);
}

#mascara_vertical path{
  transform: scale(0.002244, 0.002214);
}

.caja_tarjeta.es_horizontal.tiene_mascara .imagen_tarjeta img{
  clip-path: url(#mascara_horizontal);
  aspect-ratio: 4/3;
  width: 100%;
  height: 100%;
  max-height: 460px;
}

.caja_tarjeta.es_vertical.tiene_mascara .imagen_tarjeta img,
.caja_tarjeta.es_vertical.tiene_mascara .imagen_tarjeta .imagen_default{
  clip-path: url(#mascara_vertical);
  aspect-ratio: 4/3;
  width: 100%;
  height: 100%;
  max-height: 460px;
}
.caja_tarjeta.es_vertical.tiene_mascara .imagen_tarjeta .imagen_default{
  background-color: var(--color_primario);
  background-image: url(/assets/img/logos/logo_leon_blanco.svg);
  background-repeat: no-repeat;
  background-position: 50% 45%;
  background-size: 25%;
}

.caja_tarjeta.es_horizontal.tiene_mascara .cuerpo_tarjeta {
  width: calc(100% - 565px);
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.caja_tarjeta.es_vertical.tiene_mascara .cuerpo_tarjeta {
  width: 100%;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.sin_sombras .caja_tarjeta.es_vertical.tiene_mascara .cuerpo_tarjeta {
  padding: 0px;
}


.caja_tarjeta.es_horizontal.tiene_mascara .cuerpo_tarjeta .boton {
  min-width: 135px;
}

.caja_tarjeta.es_horizontal.tiene_mascara .texto_tarjeta {
  overflow: hidden;
  height: calc(10 * var(--h5_interlineado));
}
/*
.caja_tarjeta.es_horizontal.tiene_mascara ~ .tiene_mascara{
    margin-top: 32px;
} */

.caja_tarjeta.es_horizontal.tiene_mascara:nth-child(even) {
  flex-direction: row-reverse;
}

.caja_tarjeta.es_horizontal.tiene_mascara:nth-child(even) .imagen_tarjeta img{
  clip-path: url(#mascara_horizontal_invertido);
}

.caja_tarjeta.es_horizontal.tiene_mascara:nth-child(even) svg {
  transform: rotate(180deg);
}

.caja_tarjeta.es_horizontal.tiene_mascara:nth-child(even) svg image {
  transform: scale(-1) translate(-100%, -100%);
}

.caja_tarjeta.es_horizontal.tiene_mascara .corchete_fondo_movil{
    display: none;
}

/* estilos para aspectos de imgenes y mascaras*/
.caja_tarjeta.es_horizontal.tiene_mascara.es_1a1 .imagen_tarjeta img{
  max-height: 400px;
  aspect-ratio: 1/1;
}

.caja_tarjeta.es_vertical.tiene_mascara.es_1a1 .imagen_tarjeta img,
.caja_tarjeta.es_vertical.tiene_mascara.es_1a1 .imagen_tarjeta .imagen_default{
  max-height: 600px;
  aspect-ratio: 1/1;
}

.caja_tarjeta.es_horizontal.tiene_mascara.es_1a1 .cuerpo_tarjeta{
  width: calc(100% - 400px);
}

.caja_tarjeta.es_horizontal.redonda_horizontal.es_1a1 .imagen_tarjeta{
  width: 35%;
  min-width: 350px;
  aspect-ratio: 1/1;
}

.caja_tarjeta.es_horizontal.redonda_horizontal.es_1a1.es_destacado .imagen_tarjeta{
  width: 50%;
  min-width: 450px;
}

/* estilos para tarjetas horizontales con radios */

.redonda_horizontal{
  border-radius: 60px 4px 60px 4px;
}

.caja_tarjeta.es_horizontal.redonda_horizontal{
  margin-top: var(--unidad_base);
}

.caja_tarjeta.es_horizontal.redonda_horizontal {
  margin-top: var(--unidad_base);
}

.caja_tarjeta.redonda_horizontal .imagen_tarjeta {
  position: relative;
  border-radius: 60px 4px 60px 4px;
  max-width: 50%;
  min-width: 50%;
  aspect-ratio: 4/3;
}

.caja_tarjeta.redonda_horizontal.es_completo .imagen_tarjeta{
  min-width: 100%;
}

.caja_tarjeta.es_horizontal.redonda_horizontal .cuerpo_tarjeta {
  width: calc(100% - 350px);
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.area_logo .logo_secretaria_color {
  width: 300px;
  height: 120px;
  background-repeat: no-repeat;
  background-position: center;
  margin-bottom: calc(var(--unidad) * 3);
}

.divisor{
  background-color: var(--color_primario);
  border-radius: 10px 2px 10px 2px;
  height: calc(var(--unidad)*1.5);
  width: 25%;
  min-width: 200px;
  margin: 0px auto calc(var(--unidad)*2);
}

/*----------------------- estilos para seccion_tarjetas --------------------------*/

.seccion_tarjetas {
  margin-top:var(--unidad_base);
  gap: var(--unidad_base);
  /* width: 1440px; */
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
}

.seccion_tarjetas .caja_tarjeta {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 370px;
}

.seccion_tarjetas.\33_columnas{
  display: grid;
  grid-template-columns: repeat(3,1fr);
}

.seccion_tarjetas.sin_sombras{
  overflow: hidden;
}

.seccion_tarjetas.sin_sombras .caja_tarjeta::after{
  content: '';
  position: absolute;
  height: calc(100% + var(--unidad_base));
  width: 1px;
  top: calc(var(--unidad_base)/2 * -1);
  right: calc(var(--unidad_base)/2 * -1);
  background-color: var(--color_gris_background);
}

.seccion_tarjetas.sin_sombras .caja_tarjeta::before{
  content: '';
  position: absolute;
  width: calc(100% + var(--unidad_base));
  height: 1px;
  left: calc(var(--unidad_base)/2 * -1);
  bottom: calc(var(--unidad_base)/2 * -1);
  background-color: var(--color_gris_background);
}

.seccion_tarjetas.\34_columnas{
  display: grid;
  grid-template-columns: repeat(4,1fr);
}

/* estilo tarjeta .es_vertical_iconos */

.caja_tarjeta.es_vertical_iconos .cuerpo_tarjeta {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: auto;
}

.caja_tarjeta.es_vertical_iconos .cuerpo_tarjeta .boton {
  margin: 0px;
}

.seccion_iconos img{
  height: 40px;
  width: 40px;
}

.sin_sombras .caja_tarjeta{
  box-shadow: none !important;
  border: 0px solid transparent !important;
}

.sin_sombras .cuerpo_tarjeta{
  padding: 0px 0px 0px 32px;
}

/*Fin de Estilos para tarjetas*/

/*10.- Estilos para listas*/

.caja_lista {
  font-size: var(--h5_escala);
  font-weight: var(--h5_interlineado);
}

.caja_lista li::first-letter {
  text-transform: uppercase;
}

.caja_lista > ul {
  list-style: none;
}

.caja_lista ul li,
.caja_lista ol li {
  position: relative;
  margin-bottom: 6px;
}

.caja_lista > ul > li::before {
  font-family: "Material icons";
  content: "\e15b";
  color: var(--color_secundario);
  display: inline-block;
  margin-left: -16px;
  margin-right: 8px;
}

.caja_lista > ul > li > ul {
  list-style: none;
  margin-top: 16px;
  margin-bottom: 16px;
}

.caja_lista > ul > li > ul > li::before {
  content: "\25AA";
  color: var(--color_secundario);
  display: inline-block;
  margin-left: -16px;
  margin-right: 8px;
}

.caja_lista > ol {
  list-style: none;
  counter-reset: item;
}

.caja_lista > ol > li:before {
  content: counter(item) ". ";
  counter-increment: item;
  display: inline-block;
  margin-left: -16px;
  margin-right: 8px;
  min-width: 13px;
}

.caja_lista > ol > li > ol {
  list-style: none;
  counter-reset: chapter;
  margin-top: 16px;
  margin-bottom: 16px;
}

.caja_lista > ol > li > ol > li:before {
  content: counter(chapter, lower-alpha) ". ";
  counter-increment: chapter;
  display: inline-block;
  margin-left: -16px;
  margin-right: 8px;
}

/*Fin de Estilos para listas*/

/*11.- Estilos para buscador*/

.caja_busqueda input {
  border: 1.5px solid var(--color_gris_background);
  border-right: 0px;
  transition: all ease-in-out 0.2s;
}

.caja_busqueda .input-group:hover input {
  border: 1.5px solid var(--color_secundario);
  border-right: 0px;
  transition: all ease-in-out 0.2s;
}

.caja_busqueda button.input-group-text {
  background-color: var(--color_secundario);
  color: var(--color_blanco);
  border: 1.5px solid var(--color_secundario);
  border-left: 0px;
}

.caja_busqueda button.input-group-text:hover {
  background-color: var(--color_secundario_hover);
}

/*Fin de Estilos para buscador*/

/*12.- Estilos para tabla*/

.tabla_responsiva {
  margin: -3px;
  padding: 5px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.tabla_encabezado {
  overflow: auto;
  height: auto;
  max-height: 700px;
  box-shadow: var(--elevacion_1);
  border-radius: var(--redondez_base);
}

.tabla_encabezado thead {
  position: sticky;
  top: 0px;
  z-index: 9;
}

.tabla_encabezado::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}

.estilo_tabla {
  width: 100%;
  box-shadow: var(--elevacion_1);
  border-radius: var(--redondez_base);
}

.tabla_encabezado .estilo_tabla {
  box-shadow: none;
}

.estilo_tabla,
.estilo_tabla td,
.estilo_tabla th {
  border: 0px solid var(--ast-border-color);
}

.estilo_tabla > :not(caption) > * > * {
  border-bottom: 1px solid var(--color_secundario_hover);
  line-height: 16px;
  padding: 16px;
}

.estilo_tabla > * > * > *:first-child {
  padding-left: 32px;
}

.estilo_tabla > * > * > *:last-child {
  padding-right: 32px;
}

.estilo_tabla thead tr th,
.estilo_tabla tbody th {
  font-weight: 600;
  height: 40px;
  padding: 8px 16px;
  color: var(--color_accent);
  background-color: var(--color_dorado_background);
}
.estilo_tabla thead tr th:first-child,
.estilo_tabla tbody tr:first-child th {
  border-radius: var(--redondez_base) 0px 0px 0px;
}

.estilo_tabla thead tr th:last-child {
  border-radius: 0px var(--redondez_base) 0px 0px;
}

.estilo_tabla tbody tr:last-child th {
  border-radius: 0px 0px 0px var(--redondez_base);
}

.estilo_tabla > tbody > tr:hover td {
  background-color: var(--color_gris_background);
  --bs-table-accent-bg: var(--color_gris_background);
  transition: all 0.2s ease-in-out;
}

.estilo_tabla > tbody > tr:hover th {
  background-color: var(--color_secundario_hover);
  --bs-table-accent-bg: var(--color_secundario_hover);
  transition: all 0.2s ease-in-out;
}

.estilo_tabla > :not(caption) > *:last-child > * {
  border-bottom: 0px solid transparent;
}

.estilo_tabla .boton {
  width: auto;
  height: auto;
  padding: 8px 4px;
  font-size: 10px;
  margin-top: -10px;
  margin-bottom: -10px;
}

.estilo_tabla .boton .material-icons,
.estilo_tabla .boton .material-icons-outlined{
  font-size: 20px;
}

.caja_tabla {
  width: 100%;
  display: inline-block;
}

.caja_tabla.es_ajustada {
  width: auto;
  min-width: 500px;
  max-width: calc(50% - 32px);
  display: inline-flex;
  flex-direction: column;
}

.caja_tabla.tabla_responsiva table {
  max-width: 1700px;
  min-width: 1300px;
  width: 100%;
}

.caja_tabla table {
  margin-bottom: 0px;
}

.caja_tabla .titulo_tabla {
  margin: 8px 0px;
}

.caja_tabla > p {
  margin: 8px 0px 16px;
}

/*Fin de Estilos para tabla*/

/*13.- Estilos para tabs*/

.caja_navtab {
  border-radius: var(--redondez_base);
}

.tab-content {
  background-color: var(--color_blanco);
  border-radius: 0px 0px var(--redondez_base) var(--redondez_base);
  background-color: rgb(218 229 231 / 60%);
}

.tab-content .tab-pane {
  padding: 32px;
}

.nav-tabs {
  padding: 0px 16px;
  background-color: transparent;
}

.nav-tabs .nav-link {
  color: var(--color_gris_inactivo);
  background-color: transparent;
  border-bottom: 2px solid transparent;
  font-weight: 500;
  letter-spacing: 0.5px;
  line-height: 13px;
  padding: 16px;
  position: relative;
}

.nav-tabs .nav-link .material-icons {
  margin-right: 4px;
  margin-top: -3px;
  font-size: 16px;
  line-height: 0px;
  height: 100%;
  display: inline-flex;
  vertical-align: middle;
  align-items: center;
}

.nav-tabs .nav-link::after {
  content: "";
  position: absolute;
  right: -1px;
  top: 0;
  bottom: 0;
  margin: auto;
  height: 24px;
  width: 1px;
  background: rgba(115, 131, 156, 0.2);
}

.nav-tabs .nav-link:first-child::before {
  content: "";
  position: absolute;
  left: -1px;
  top: 0;
  bottom: 0;
  margin: auto;
  height: 24px;
  width: 2px;
  background: rgba(115, 131, 156, 0.2);
}

.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
  color: var(--color_secundario);
  border-color: transparent;
  text-decoration: none;
  border-bottom: 2px solid var(--color_secundario);
  outline: none;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
  border-color: var(--color_secundario);
  border-bottom: 2px solid var(--color_primario_background);
  background-color: var(--color_blanco);
  color: var(--color_secundario);
  font-weight: 600;
}

/* estilos para navtabs landing */

.es_completo {
    display: flex;
    justify-content: space-around !important;
    flex-direction: row;
    flex-wrap: nowrap;
  }

  .es_landing{
    background-color: var(--color_dorado_background);
    padding: calc(var(--unidad)*2);
  }

  .es_landing button {
    border: none !important;
    background: transparent !important;
    width: 100%;
  }

  .es_landing .nav-link::after {
    content: "";
    position: absolute;
    right: -1px;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 34px;
    width: 0px;
    background: rgba(115, 131, 156, 0.2);
  }

  .es_landing .nav-link::before {
    content: "";
    position: absolute;
    left: -1px;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 34px;
    width: 1.2px;
    background: rgba(115, 131, 156, 0.2);
  }

  .nav-tabs .nav-link:first-child::before {
    content: "";
    position: absolute;
    left: -1px;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 24px;
    width: 0px;
    background: rgba(115, 131, 156, 0.2);
}

/*Fin de Estilos para tabs*/

/*14.- Estilos para tooltips*/
.tooltip.show {
  opacity: 1;
}

.tooltip .tooltip-inner {
  background-color: var(--color_accent);
  padding: 8px;
  font-size: 13px;
  line-height: 13px;
}

.bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before,
.bs-tooltip-top .tooltip-arrow::before {
  border-top-color: var(--color_accent);
}

.bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before,
.bs-tooltip-end .tooltip-arrow::before {
  border-right-color: var(--color_accent);
}

.bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before,
.bs-tooltip-bottom .tooltip-arrow::before {
  border-bottom-color: var(--color_accent);
}

.bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow::before,
.bs-tooltip-start .tooltip-arrow::before {
  border-left-color: var(--color_accent);
}

/*Fin de Estilos para tooltips*/

/*15.- Estilos para modal*/

.modal-backdrop {
  background: var(--color_gris_inactivo);
}

.modal-content {
  box-shadow: var(--elevacion_3);
  border: 1px solid transparent;
  border-radius: var(--redondez_base);
}

.modal-header {
  border-bottom: 1px solid transparent;
  padding: 32px;
  padding-bottom: 8px;
}

.modal-footer {
  border-top: 1px solid transparent;
  padding: 32px;
  justify-content: flex-start;
}

.modal-footer .boton {
  min-width: 145px;
  margin: 0px;
}

.modal-body {
  padding: 0px 32px;
}

.modal-body p:last-of-type {
  margin-bottom: 0px;
}

.modal-body p {
  text-align: justify;
}

/*Fin de Estilos para modal*/

/*16.- Estilos para footer*/

.seccion_enlaces {
  background-color: var(--color_gris_background);
  display: inline-flex;
  width: 100%;
  padding: 32px 0px;
}

.seccion_enlaces .caja_enlaces{
  display: inline-flex;
  width: 100%;
  margin: 0px auto;
  padding: var(--relleno_fila);
  max-width: var(--ancho_base);
  justify-content: center;
  flex-direction: row;
}

.seccion_enlaces .area_enlaces {
  width: 100%;
  display: inline-flex;
  padding-left: 80px;
}

.seccion_enlaces .caja_enlaces .area_enlaces{
  padding-left: 0px;
}

.seccion_enlaces .area_enlaces .col {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  width: auto;
  margin-right: 32px;
}

.seccion_enlaces .area_enlaces .col a {
  margin-top: 8px;
  width: max-content;
}

.seccion_enlaces .escudo_enlaces {
  width: 140px;
  margin-right: 80px;
}

.seccion_enlaces .caja_enlaces .escudo_enlaces{
  margin-right: 0px;
}

.escudo_footer {
  display: inline-block;
  width: 100%;
  /*max-width: 220px;*/
}

.escudo_footer svg * {
  fill: var(--color_blanco);
}

footer .seccion_redes{
  display: flex;
  justify-content: space-between;
  background-color: var(--color_primario);
  color: var(--color_blanco);
  padding: 32px 0px;
  width: 100%;
  margin-top: 0px !important;
}

footer .seccion_redes .caja_redes{
  display: inline-flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  margin: 0px auto;
  padding: var(--relleno_fila);
  max-width: var(--ancho_base);
  color: var(--color_blanco);
  width: 100%;
}

footer .seccion_redes .area_escudo {
  position: relative;
  /*padding-left: 80px;*/
}

footer .seccion_redes .area_redes {
  /*padding-right: 80px;*/
}

footer .seccion_redes .caja_redes .area_escudo {
  padding-left: 0px;
}

footer .seccion_redes .caja_redes .area_redes {
  padding-right: 0px;
}

footer .seccion_redes .area_escudo .leyenda_avisos {
  margin-top: calc(var(--unidad) * 2);
}

footer .seccion_redes .area_redes .leyenda_redes {
  margin-bottom: var(--unidad);
  margin-left: 6px;
}

.seccion_leyenda {
  font-family: "Maven Pro", sans-serif;
  background-color: var(--color_gris_background);
  padding: 16px 80px;
  display: inline-flex;
  width: 100%;
  justify-content: space-evenly;
  align-content: center;
  color: var(--color_secundario);
  text-transform: uppercase;
  font-size: var(--h6_escala);
  align-items: center;
}

.seccion_leyenda .primera_leyenda {
  width: 100%;
  text-align: right;
  letter-spacing: 2px;
}

.seccion_leyenda .logo_leyenda {
  color: var(--color_secundario) !important;
  padding: 0px 32px;
}

.seccion_leyenda .logo_leyenda svg {
  width: 25px;
}

.seccion_leyenda .logo_leyenda img {
  height: 32px;
}

.seccion_leyenda .segunda_leyenda {
  width: 100%;
  letter-spacing: 2px;
}

/*Fin de Estilos para footer*/

/*17.- Estilos para titulos*/

.caja_titulo {
  padding: var(--unidad_base);
  background-color: var(--color_gris_background); /*#F9FAFB*/
}

.caja_titulo h3{
    margin: auto;
    max-width: var(--ancho_base);
    position: relative;
    color: var(--color_primario);
}

.caja_titulo h3::before {
  content: " ";
  width: 30px;
  height: 4px;
  background-color: var(--color_secundario);
  position: absolute;
  bottom: -4px;
}

.caja_titulo h2 {
  color: var(--color_secundario);
  font-size: var(--h2_escala);
  line-height: var(--h2_interlineado);
}

.caja_titulo p:last-of-type {
  margin-bottom: 0px;
}

.seccion_titulo{
    width: 100%;
    display: inline-flex;
    align-items: center;
    position: relative;
    margin-top: var(--unidad_base);
}

.seccion_titulo p{
    margin-bottom: 0px;
    position: relative;
    margin-left: calc(var(--unidad)* 2);
    font-size: var(--h5_escala);
}

.seccion_titulo p::before{
    content: '';
    position: absolute;
    left: -8px;
    width: 2px;
    height: 100%;
    background-color: var(--color_accent);
}

.seccion_titulo .icono_seccion{
    position: relative;
    min-width: 50px;
    margin-right: 16px;
    margin-bottom: 4px;
}

.seccion_titulo .icono_seccion svg *{
    fill: var(--color_primario_etiqueta);
}

.seccion_titulo .icono_seccion span{
    color: var(--color_blanco);
    position: absolute;
    height: 100%;
    width: 90%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.descripcion{
    display: inline-flex;
    flex-direction: row;
    margin-top: var(--unidad_base);
}

.descripcion .icono_descripcion{
    margin-right: 16px;
    position: relative;
    height: min-content;
    width: min-content;
}

.descripcion .icono_descripcion svg *{
    fill: var(--color_primario_etiqueta);
}

.descripcion .icono_descripcion span {
    color: var(--color_blanco);
    position: absolute;
    height: 90%;
    width: 100%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.descripcion .area_boton{
    margin: 0px;
    margin-top: calc(var(--unidad) * 2);
}

/*Fin de Estilos para titulos*/

/*18.- Estilos para Login*/

#form_login,
.form_login {
  width: 100%;
}

.body_login {
  text-align: center;
  background-color: var(--color_primario_background);
}

.tiene_fondo {
    width: 100%;
    height: auto;
    max-height: 100%;
    min-height: 100vh;
    display: inline-flex;
    flex-direction: column;
    position: relative;
    background-color: var(--color_primario);
}

    .tiene_fondo::before {
        content: "";
        width: 100%;
        height: 100%;
        position: absolute;
        /*background-image: url(http://recursos.digital.nl.gob.mx/assets/img/fondos/imagen_login.webp);*/
        background-image: url(/images/fondologin.png);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: 85% bottom;
        z-index: -1;
    }

.tiene_fondo::after{
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    /*background: linear-gradient(180deg, var(--color_primario) 0%, rgba(217, 217, 217, 0) 100%);*/
    z-index: -1;
}

.tiene_fondo.variante_1::before{
  background-image: url(/assets/img/fondos/variante_1.png);
  background-size: cover;
  background-position: center;
}

.tiene_fondo .leon_para_caja {
  display: none;
}

.area_login {
  width: 100%;
  /* height: calc(100% - 50px);
    max-height: 740px; */
  max-width: var(--ancho_base);
  padding: var(--relleno_fila);
  height: auto;
  display: inline-flex;
  justify-content: center;
  position: relative;
  overflow: hidden;
}

.es_izquierda .area_login {
  justify-content: flex-start;
}

.es_derecha .area_login {
  justify-content: flex-end;
}

.area_login .fondo_area_login {
  height: max-content;
  max-width: 550px;
  position: relative;
  top: 0px;
}

.caja_login {
  position: absolute;
  width: 100%;
  max-width: calc(550px - 10px);
  text-align: center;
  padding: 0px 40px;
}

.logo_login {
  width: 250px;
  margin: 24px auto;
}

.caja_login h2 {
  font-family: "Maven Pro";
  color: var(--color_secundario);
  margin: 0px 0px 24px 0px;
}

.caja_login .input-group {
  margin-bottom: 24px;
}

.caja_login .input-group input.form-control {
  border-top-right-radius: var(--redondez_base) !important;
  border-bottom-right-radius: var(--redondez_base) !important;
}

.caja_login .input-group input::placeholder {
  color: var(--color_blanco) !important;
}

.caja_login .leon_para_caja {
  width: 148px;
  position: absolute;
  left: calc(100% + 0px);
  top: calc(100% - 160px);
  z-index: -1;
}

.caja_contraseña {
  display: flex;
  justify-content: space-between;
}

.caja_contraseña .caja_checkbox {
  margin-bottom: 24px;
  margin-top: 0px;
}

.caja_contraseña .caja_checkbox .checkbox {
  margin-left: 3px;
  margin-bottom: 0px;
}

.caja_terminos {
  position: relative;
  width: 100%;
  max-width: var(--ancho_base);
  padding: var(--relleno_fila);
  margin: auto;
  text-align: center;
  font-size: var(--etiqueta_escala);
  line-height: var(--etiqueta_interlineado);
  color: var(--color_primario);
  display: inline-flex;
  flex-direction: column;
}

.es_izquierda .caja_terminos {
  justify-content: flex-start;
}

.es_derecha .caja_terminos {
  justify-content: flex-end;
}

.es_izquierda .caja_terminos p,
.es_derecha .caja_terminos p {
  width: 100%;
  max-width: 550px;
}

.caja_terminos .area_logos_login {
  width: 100%;
  max-width: 550px;
  margin-bottom: calc(var(--unidad) * 2);
  display: inline-flex;
  flex-direction: row;
  justify-content: space-between;
}

.caja_terminos .area_logos_login .logo_secretaria{
    width: calc(50% - 32px);
    height: 88px;
    margin-bottom: 0px;
    margin-right: calc(var(--unidad) * 2);
    margin-left: calc(var(--unidad) * 2);
    background-repeat: no-repeat;
    background-position: center left;
    background-size: contain;
}

/*.caja_terminos .area_logos_login .logo_secretaria.es_administracion,
.administracion .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/administracion.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_economia,
.economia .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/economia.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_educacion,
.educacion .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/educacion.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_ambiente,
.ambiente .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/medio_ambiente.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_contraloria,
.contraloria .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/contraloria.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_cultura,
.cultura .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/cultura.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_agropecuario,
.agropecuario .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/agropecuario.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_inclusion,
.inclusion .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/igualdad_inclusion.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_movilidad,
.movilidad .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/movilidad.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_mujeres,
.mujeres .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/mujeres.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_participacion,
.participacion .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/participacion_ciudadana.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_salud,
.salud .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/salud.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_seguridad,
.seguridad .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/seguridad.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_tesoreria,
.tesoreria .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/tesoreria.svg);
}*/

    .caja_terminos .area_logos_login .logo_secretaria.es_trabajo,
    .trabajo .caja_terminos .area_logos_login .logo_secretaria {
        /*background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/trabajo.svg);*/
        background-image: url(/images/logo_login_trabajo.svg);
    }

/*.caja_terminos .area_logos_login .logo_secretaria.es_turismo,
.turismo .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/turismo.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_agua_drenaje, 
.agua_drenaje .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/otros_logos/servicios_agua_drenaje_monterrey.svg);
}

.caja_terminos .area_logos_login .logo_secretaria.es_nl_travel,
.nl_travel .caja_terminos .area_logos_login .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/otros_logos/nuevo_leon_travel.svg);
}*/

footer .logo_secretaria{
    height: 90px;
    margin-bottom: var(--unidad);
    background-repeat: no-repeat;
    background-position: center left;
    background-size: contain;
}

.administracion .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/administracion.svg);
}

.economia .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/economia.svg);
}

.educacion .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/educacion.svg);
}

.ambiente .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/medio_ambiente.svg);
}

.contraloria .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/contraloria.svg);
}

.cultura .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/cultura.svg);
}

.agropecuario .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/agropecuario.svg);
}

.inclusion .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/igualdad_inclusion.svg);
}

.movilidad .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/movilidad.svg);
}

.mujeres .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/mujeres.svg);
}

.participacion .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/participacion_ciudadana.svg);
}

.salud .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/salud.svg);
}

.seguridad .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/seguridad.svg);
}

.tesoreria .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/tesoreria.svg);
}

.trabajo .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/trabajo.svg);
}

.turismo .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/turismo.svg);
}

.gobierno .logo_secretaria_color{
  width: 120px !important;
  height: 180px !important;
  background-size: contain;
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/logos/logo_leon_pie.svg);
}

.default .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/logos/logo_estado.svg);
}

.buen_gobierno .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/gabinetes/gabinete_buen_gobierno.svg);
}

.igualdad .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/gabinetes/igualdad_para_todas_personas.svg);
}

.riqueza .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/gabinetes/gabinete_generacion_riquezas.svg);
}

.agua_drenaje .logo_secretaria_color{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/otros_logos/servicios_agua_drenaje_monterrey.svg);
}

.nl_travel .logo_secretaria_color{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/otros_logos/nuevo_leon_travel.svg);
}

.administracion .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/administracion_blanco.svg);
}

.economia .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/economia_blanco.svg);
}

.educacion .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/educacion_blanco.svg);
}

.ambiente .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/medio_ambiente_blanco.svg);
}

.contraloria .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/contraloria_blanco.svg);
}

.cultura .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/cultura_blanco.svg);
}

.agropecuario .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/agropecuario_blanco.svg);
}

.inclusion .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/igualdad_inclusion_blanco.svg);
}

.movilidad .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/movilidad_blanco.svg);
}

.mujeres .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/mujeres_blanco.svg);
}

.participacion .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/participacion_ciudadana_blanco.svg);
}

.salud .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/salud_blanco.svg);
}

.seguridad .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/seguridad_blanco.svg);
}

.tesoreria .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/tesoreria_blanco.svg);
}

.trabajo .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/trabajo_blanco.svg);
}

.turismo .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/turismo_blanco.svg);
}

.buen_gobierno .logo_secretaria{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/gabinetes/gabinete_buen_gobierno_blanco.svg);
}

.igualdad .logo_secretaria{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/gabinetes/igualdad_para_todas_personas_blanco.svg);
}

.riqueza .logo_secretaria{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/gabinetes/gabinete_generacion_riquezas_blanco.svg);
}

.agua_drenaje .logo_secretaria{
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/otros_logos/servicios_agua_drenaje_monterrey_blanco.svg);
}

.nl_travel .logo_secretaria{
    background-image: url(http://recursos.digital.nl.gob.mx/assets/img/otros_logos/nuevo_leon_travel_blanco.svg);
}

.caja_terminos .area_logos_login .logo_secretaria svg {
  padding-bottom: 20px;
  padding-top: 20px;
}

.caja_terminos .area_logos_login .logo_estatal {
  width: calc(42% - 32px);
  height: 100px;
  margin-right: calc(var(--unidad) * 2);
  margin-left: calc(var(--unidad) * 2);
  padding-bottom: 20px;
  padding-top: 20px;
}

.caja_terminos .area_logos_login .logo_estatal.es_background {
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/logos/logo_estado.svg);
  background-repeat: no-repeat;
  background-position: center;
  height: auto;
  padding-bottom: 0px;
  padding-top: 0px;
}

/*Fin de Estilos para Login*/

/*19.- Estilos para verificador*/

.caja_verificador .caja_acordeon .accordion-button {
  font-size: var(--etiqueta_escala);
  line-height: var(--etiqueta_interlineado);
  background-color: transparent !important;
  border: 2px solid transparent !important;
  border-radius: 0px !important;
  box-shadow: none !important;
  color: var(--color_gris_inactivo);
}

.caja_verificador .accordion.caja_acordeon .accordion-item {
  border-radius: 0px;
}

.caja_verificador .caja_acordeon .accordion-header {
  height: var(--alto_verificador);
  min-height: var(--alto_verificador);
  margin: auto;
  padding: var(--relleno_fila);
  max-width: var(--ancho_base);
}

.caja_verificador .caja_acordeon .accordion-button::after {
  margin-left: 4px;
  background-color: transparent;
  color: var(--color_primario);
  font-size: 18px;
}

.caja_verificador .caja_acordeon .accordion-body {
  border-radius: 0px;
}

.caja_verificador .caja_acordeon .accordion-body .row {
  padding: var(--relleno_fila);
  margin: auto;
  max-width: var(--ancho_base);
}

.caja_verificador .caja_acordeon .accordion-body .col {
  text-align: left;
  max-width: 40%;
  display: inline-flex;
  align-items: center;
  padding-left: 0px;
}

.caja_verificador .caja_acordeon .accordion-body .col > * + * {
  margin-left: 8px;
}

.caja_verificador .logo_verificar {
  width: 63px;
}

.caja_verificador .logo_sitio_seguro {
  width: 63px;
}

/*Fin de Estilos para verificador*/

/*20.- Estilos para header*/

header {
  position: relative;
  z-index: 11;
}

header.es_estatico {
  position: sticky;
  top: 0;
  z-index: 1021;
  margin-top: var(--alto_verificador);
}

header.es_estatico > .caja_verificador {
  position: relative;
  width: 100%;
  z-index: 1022;
  top: calc(-1 * var(--alto_verificador));
}

header.es_estatico > .caja_header:first-of-type {
  margin-top: calc(-1 * var(--alto_verificador));
}

.caja_header {
  background-color: var(--color_blanco);
  border-bottom: 1px solid var(--color_gris_background);
  padding-top: 8px;
  padding-bottom: 8px;
  min-height: var(--alto_navegador);
}

.caja_header > .container-fluid {
  padding: var(--relleno_fila);
  max-width: var(--ancho_base);
}

.caja_header .logo_header {
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/logos/logo_genl.svg);
  background-repeat: no-repeat;
  width: 137px;
  height: 32px;
}

.caja_header .area_logo {
  display: flex;
  align-items: center;
}

.caja_header .navbar-collapse {
  justify-content: flex-end;
}

.caja_header .nav-item {
  margin-right: 16px;
  position: relative;
}

.caja_header .nav-item .nav-link {
  color: var(--color_gris_inactivo);
}

.caja_header .nav-item .nav-link:hover,
.caja_header .nav-item .nav-link.active {
  color: var(--color_accent);
}

.caja_header .nav-item::after{
    content: '';
    width: 100%;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
    background-position: bottom;
    background-repeat: no-repeat;
    background-image: linear-gradient( transparent calc(100% - 2px), var(--color_secundario) 2px ), linear-gradient( transparent calc(100% - 2px), transparent 2px );
    background-size: 0% 6px, 100% 6px;
    -webkit-transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1);
    -moz-transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1);
}

.caja_header .nav-item:hover {
  color: var(--color_primario_hover);
  text-decoration: none;
  transition: all 0.2s ease-in-out;
}

.caja_header .nav-item:hover::after {
  background-size: 100% 6px, 100% 6px;
}

.caja_header .nav-item:visited {
  color: var(--color_primario_hover);
}

.caja_header .nav-item.dropdown {
  padding-right: 14px;
}

.caja_header .dropdown-toggle {
  display: inline-block;
}

.caja_header .dropdown-toggle::after {
  font-family: "Material icons";
  content: "\e5cf";
  color: var(--color_negro);
  width: auto;
  height: 100%;
  top: 0;
  display: inline-flex;
  font-weight: 500;
  font-size: 18px;
  line-height: 1;
  position: absolute;
  border: 0px;
  align-items: center;
}

.caja_header .area_sesion .dropdown-toggle::after {
  right: 0;
}

.caja_header .dropdown-menu {
  top: calc(100% + 14px);
}

.caja_header .navbar-toggler {
  height: calc(64px - 16px);
  margin-right: 8px;
  color: rgba(0, 0, 0, 0.55);
  border: 0px;
  box-shadow: none;
}

.caja_header .caja_busqueda {
  width: auto;
  margin-right: 16px;
}

.caja_header input.form-control {
  height: 40px;
  font-size: var(--h6_escala);
}

.caja_header .caja_busqueda input {
  display: inline-block;
  outline: none;
  width: 0px;
  position: relative;
  top: 0;
  right: -32px;
  margin-left: -32px;
  background: none;
  z-index: 3;
  transition: width 0.4s cubic-bezier(0, 0.795, 0, 1);
  cursor: pointer;
}

.caja_header .caja_busqueda:hover input,
.caja_header .caja_busqueda input:focus {
  width: 246px;
  padding-right: 48px;
  z-index: 1;
  cursor: text;
}

.caja_header .caja_busqueda button {
  border-radius: var(--redondez_base) !important;
  position: relative;
  z-index: 10;
}

.caja_header .caja_busqueda:hover button,
.caja_header .caja_busqueda input:focus + button {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.caja_header .boton{
    min-height: 40px;
    padding: 8px 16px;
    font-size: var(--h6_escala);
}

.area_sesion .datos_usuario {
  display: inline-flex;
  align-items: center;
  margin-right: 20px;
}

.area_sesion .datos_usuario > div {
  position: relative;
  text-align: right;
  margin-right: 8px;
  color: var(--color_gris_inactivo) !important;
}

.area_sesion .datos_bienvenida {
  position: absolute;
  top: -14px;
  right: 0px;
  font-size: 10px;
}

.area_sesion .avatar_sesion {
  padding: 6.5px 13px;
}

.avatar {
  background-color: var(--color_primario);
  color: var(--color_blanco);
  border-radius: 100%;
  font-size: 20px;
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.datos_usuario .avatar {
  margin-top: -3.5px;
  margin-bottom: -3.5px;
}

.modo_oscuro .caja_header {
  background-color: var(--color_accent);
}

.modo_oscuro .caja_header .logo_header {
  background-image: url(http://recursos.digital.nl.gob.mx/assets/img/logos/logo_genl_blanco.svg);
}

.modo_oscuro .caja_header .nav-item .nav-link {
  color: var(--color_blanco);
}

.modo_oscuro .area_sesion .datos_usuario > div {
  color: var(--color_blanco) !important;
}

.modo_oscuro .caja_header .dropdown-toggle::after {
  color: var(--color_blanco);
}

.modo_oscuro .caja_header .caja_busqueda input {
  background: var(--color_blanco);
}

.modo_oscuro .caja_header .boton_primario {
  color: var(--color_accent);
  background-color: var(--color_blanco);
}

.modo_oscuro .avatar {
  color: var(--color_accent);
  background-color: var(--color_blanco);
}

/*Fin de Estilos para header*/

/*21.- Estilos para menu vertical*/

#menu_vertical {
  position: sticky;
  top: var(--alto_navegador);
  bottom: 0;
  left: 0;
  padding: 0px;
  height: calc(100vh - var(--alto_navegador));
  z-index: 10;
  width: 0;
  overflow-y: auto;
  transform: translateX(0%);
  transition: all 0.3s ease-in-out;
}

#menu_vertical.show {
  width: var(--ancho_menu);
}

#menu_vertical ~ main {
    flex: 1 0 0%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#menu_vertical ~ main .contenedor_general{
    margin-right: auto;
    margin-left: auto;
    height: 100%;
    max-width: calc(var(--ancho_base) + 64px);
    min-height: fit-content;
}

#menu_vertical.sin_header,
#menu_vertical.sin_header + .boton_menu {
  --alto_navegador: 0px;
}

.boton_menu {
  position: sticky;
  top: calc(var(--alto_navegador) + 16px);
  margin-left: -16px;
  margin-right: -16px;
  margin-top: 16px;
  left: 0px;
  width: 32px;
  height: 32px;
  min-height: 32px;
  padding: 0px;
  background-color: var(--color_secundario_hover);
  color: var(--color_blanco);
  border-radius: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
}

.boton_menu:hover {
  color: var(--color_blanco);
  background-color: var(--color_secundario);
}

#menu_vertical.show + .boton_menu {
  transform: translateX(0px) rotate(0deg);
  transition: all 0.3s ease-in-out;
}

#menu_vertical.show + .boton_menu #mas {
  display: none;
}

#menu_vertical + .boton_menu #menos {
  display: none;
}

#menu_vertical.show + .boton_menu #menos {
  display: block;
}

#menu_vertical + .boton_menu {
  transform: translateX(-20px);
  transition: all 0.3s ease-in-out;
}

#menu_vertical:not(.show) + .boton_menu:hover {
  transform: translateX(-5px);
  transition: all 0.3s ease-in-out;
}

#menu_vertical.menu_con_iconos + .boton_menu {
  transform: translateX(0px);
  transition: all 0.3s ease-in-out;
}

#menu_vertical.menu_con_iconos:not(.show) + .boton_menu:hover {
  transform: translateX(0px);
  transition: all 0.3s ease-in-out;
}

.boton_menu .material-icons {
  margin-left: 0px;
  margin-right: 0px;
  font-size: inherit;
  height: auto;
  display: inline-flex;
  vertical-align: middle;
  align-items: center;
}

#menu_vertical ul {
  list-style: none;
  padding-left: 0px;
  color: var(--color_accent);
}

#menu_vertical ul li a {
  color: var(--color_accent);
  width: 100%;
  height: auto;
  min-height: 32px;
  padding: 0px 32px 0px 16px;
  margin: 2px 0px;
  display: inline-flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  border-radius: var(--redondez_base);
}

#menu_vertical ul li a .material-icons {
  margin-right: 4px;
  font-size: 15px;
  margin-bottom: 2px;
}

#menu_vertical .icono_menu.material-icons {
  width: auto;
  height: auto;
  display: flex;
  align-items: center;
}

#menu_vertical ul li a .icono_menu.material-icons > * {
  width: 15px;
  height: 15px;
}

#menu_vertical ul a + ul a {
  padding-left: calc(32px + 4px);
}

#menu_vertical ul a + ul a + ul a {
  padding-left: calc(48px + 4px);
}

#menu_vertical ul li a:hover {
  color: var(--color_accent);
  background-color: var(--color_primario_background);
  transition: all 0.3s ease-in-out;
}

#menu_vertical ul li a[aria-expanded="true"],
#menu_vertical ul li.activo a,
#menu_vertical a[aria-expanded="true"] + ul li.seleccion > a:not([aria-expanded="false"]){
/* #menu_vertical ul li.linea_seleccion > a + ul li.seleccion a{ */
    color: var(--color_blanco);
    background-color: var(--color_primario);
    transition: all 0.3s ease-in-out;
}

#menu_vertical ul li a[aria-expanded="true"] svg *,
#menu_vertical ul li.activo a svg *,
#menu_vertical a[aria-expanded="true"] + ul li.seleccion > a:not([aria-expanded="false"]) svg *{
    fill: var(--color_blanco);
}

#menu_vertical ul li a[data-bs-toggle="collapse"]::after {
  font-family: "Material icons";
  content: "\e5cf";
  color: var(--color_negro);
  width: auto;
  height: 100%;
  top: 0;
  right: 10px;
  display: inline-flex;
  font-weight: 500;
  font-size: 18px;
  line-height: 1;
  position: absolute;
  border: 0px;
  align-items: center;
  transform: rotate(0deg);
  transition: all 0.3s ease-in-out;
}

#menu_vertical ul li a[aria-expanded="true"][data-bs-toggle="collapse"]::after {
  color: var(--color_blanco);
  transform: rotate(180deg);
  transition: all 0.3s ease-in-out;
}

#menu_vertical ul li.linea_seleccion > a {
  color: var(--color_accent);
  background-color: var(--color_primario_background);
  transition: all 0.3s ease-in-out;
}

#menu_vertical ul li.linea_seleccion > a svg * {
  fill: var(--color_accent);
}

#menu_vertical ul li.linea_seleccion > a[aria-expanded="true"][data-bs-toggle="collapse"]::after{
    color: var(--color_accent);
    transition: all 0.3s ease-in-out;
}

#menu_vertical.menu_con_iconos:not(.show) {
  width: 80px;
  visibility: visible;
  overflow: initial;
}

#menu_vertical.menu_con_iconos:not(.show) a {
  width: 0px;
  min-width: 38px;
  overflow: hidden;
  white-space: nowrap;
  padding: 0px 8px 0px 8px;
  transition: all 0.3s ease-in-out;
}

#menu_vertical.menu_con_iconos:not(.show) ul:first-child {
  position: relative;
  margin-top: 40px;
  margin-left: 8px;
}

#menu_vertical.menu_con_iconos:not(.show) ul li a .material-icons {
  font-size: 24px;
  margin-right: 8px;
}

#menu_vertical.menu_con_iconos:not(.show) ul li a .icono_menu.material-icons > *{
    width: 24px;
    height: 24px;
}

#menu_vertical.menu_con_iconos:not(.show) ul li a[data-bs-toggle="collapse"]::after{
    right: -21px;
    opacity: 0;
    transition: all 0.3s ease-in-out;
}

#menu_vertical.menu_con_iconos:not(.show) ul a + ul a::before {
  content: "\e5cc";
  font-family: "Material icons";
  color: var(--color_negro);
  width: auto;
  height: 100%;
  font-size: 20px;
  display: flex;
  align-items: center;
  padding: 0px 8px 0px 2px;
}

#menu_vertical.menu_con_iconos:not(.show) ul a + ul li.activo a::before,
#menu_vertical.menu_con_iconos:not(.show) ul a + ul li.seleccion a[aria-expanded="true"]::before{
    color: var(--color_blanco);
}

#menu_vertical.menu_con_iconos:not(.show):hover {
  width: var(--ancho_menu);
  transition: all 0.3s ease-in-out;
}

#menu_vertical.menu_con_iconos:not(.show):hover a {
  width: 100%;
  transition: all 0.3s ease-in-out;
}

#menu_vertical.menu_con_iconos:not(.show):hover ul li a[data-bs-toggle="collapse"]::after{
    right: 8px;
    opacity: 1;
    transition: all 0.3s ease-in-out;
}

/*Fin de Estilos para menu vertical*/

/*22.- Estilos para carrusel */

.caja_carrusel {
  width: 100%;
  overflow: hidden;
}

.caja_carrusel .carousel-control-next,
.caja_carrusel .carousel-control-prev {
  width: 50px;
}

.caja_carrusel .carousel-control-prev-icon {
  background-image: none;
  width: 24px;
  height: 24px;
}

.caja_carrusel .carousel-control-prev-icon::after {
  font-family: "Material icons";
  content: "\e5cb";
  color: var(--color_blanco);
  background-color: var(--color_secundario);
  border-radius: 50%;
  width: auto;
  height: auto;
  font-weight: 500;
  font-size: 24px;
  line-height: 1;
}

.caja_carrusel .carousel-control-next-icon {
  background-image: none;
  width: 24px;
  height: 24px;
}

.caja_carrusel .carousel-control-next-icon::after {
  font-family: "Material icons";
  content: "\e409";
  color: var(--color_blanco);
  background-color: var(--color_secundario);
  border-radius: 50%;
  width: auto;
  height: auto;
  font-weight: 500;
  font-size: 24px;
  line-height: 1;
}

.caja_carrusel .carousel-indicators {
  background-color: var(--color_blanco);
  border-radius: 24px 24px 0px 0px;
  width: min-content;
  padding: 16px 32px 16px 32px;
  margin: auto;
  box-shadow: var(--elevacion_1);
  margin-bottom: -16px;
  transition: all 0.3s;
}

.caja_carrusel .carousel-indicators .active {
  background-color: var(--color_secundario);
}

.caja_carrusel .carousel-indicators:hover {
  margin-bottom: 0px;
  transition: all 0.3s ease-in-out;
}

.caja_carrusel .carousel-indicators [data-bs-target] {
  width: 16px;
  height: 16px;
  margin-right: 2px;
  margin-left: 2px;
  border-radius: 50%;
  border: 1px solid var(--color_secundario);
}

.caja_carrusel .carousel-inner .carousel-item{
  min-height: 300px;
}

.caja_carrusel .carousel-inner .carousel-item::before {
  content: "";
  position: absolute;
  z-index: 10;
  top: var(--unidad_base);
  left: 0;
  right: 0;
  margin: 0px auto;
  border-radius: 0px 0px var(--redondez_base) var(--redondez_base);
  width: calc(var(--unidad) * 8);
  height: calc(var(--unidad) * 8);
  background-color: var(--color_secundario);
  background-image: url(/assets/img/logos/logo_leon_pie_blanco.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: calc(100% - 32px);
}

/*Fin de Estilos para carrusel*/

/*23.- Estilos para banner estatico*/

.caja_banner {
  position: relative;
  overflow: hidden;
  background-color: var(--color_primario);
}

.tiene_logo{
  position: relative;
  z-index: 2;
  padding: 30px;
  min-height: 300px;
  max-height: 400px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.tiene_logo img {
  height: 150px;
}

.tiene_logo h2,
.tiene_logo h4 {
  color: #fff;
  text-align: center;
}

.caja_banner .banner_cover {
  position: absolute;
  opacity: 0.3;
  /* filter: alpha(opacity=30); */
  object-fit: cover;
  top: 0;
  z-index: 1;
  height: 100%;
  width: 100%;
}

.caja_banner.es_cuadricula{
  overflow: visible;
  height: 200px;
  margin-bottom: calc( var(--unidad)*13);
}

.caja_banner.es_cuadricula > img{
  position: absolute;
  z-index: 1;
  top: -6px;
  width: auto;
  right: 0;
  left: 0;
  margin: auto;
  opacity: 1;
  height: auto;
}

.caja_banner.es_cuadricula .area_cuadricula{
  height: 100%;
  width: 100%;
  top: 0;
  position: absolute;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.caja_banner.es_cuadricula .tiene_logo{
  min-height: calc(100% + 30px);
}

.caja_banner.es_cuadricula .logo_secretaria_color{
  width: 300px;
  height: 120px;
  background-repeat: no-repeat;
  background-position: center;
}

.caja_banner.es_cuadricula .area_cuadricula .primero{
  background-color: var(--color_primario_hover);
}

.caja_banner.es_cuadricula .area_cuadricula .segundo{
  background-color: var(--color_primario);
}

.caja_banner.es_cuadricula .area_cuadricula .tercero{
  background-color: var(--color_primario_etiqueta);
}

.caja_banner.es_cuadricula .area_cuadricula .cuarto{
  background-color: var(--color_primario_background);
}

/* fin para estilos de banner ----------------------------------- */


/*24.- Estilos para caja navegador*/

.area_navegadores {
  display: flex;
  flex-wrap: wrap;
  gap: var(--unidad_base);
  justify-content: center;
  margin-top: var(--unidad_base);
}

.caja_navegador {
  flex: 1 0 calc(25% - 32px);
  min-width: 200px;
  width: 100%;
  max-width: calc(50% - 16px);
  cursor: pointer;
  font-weight: 500;
  text-align: center;
  padding: var(--unidad_base);
  border-radius: var(--redondez_base);
  color: var(--color_primario);
  background-color: var(--color_primario_background);
}

.caja_navegador .icono_caja{
  display: flex;
  height: auto;
  width: auto;
  justify-content: center;
  align-items: center;
}

.caja_navegador .icono_caja svg {
  width: 32px;
  height: 32px;
}

.caja_navegador svg * {
  fill: var(--color_secundario);
}

.caja_navegador:hover {
  background-color: var(--color_primario_etiqueta);
  color: var(--color_blanco);
}

/* .caja_navegador:focus {
  background-color: var(--azul_informativo_back);
  color: var(--azul_informativo);
  border-color: var(--azul_informativo);
} */

a.caja_navegador:hover svg * {
  fill: var(--color_blanco);
}

/* a.caja_navegador:focus svg * {
  fill: var(--azul_informativo);
} */

/* estilos para "caja_navegador" en variante Horizontal con clase "es_horizontal */

.caja_navegador.es_horizontal{
  justify-content: center;
  align-items: center;
  flex-direction: row !important;
}

header.es_estatico section{
  position: relative;   
  top: -32px;
}

.navegacion_redes{
  background: var(--color_blanco);
  border-bottom: 0.5px solid var(--color_gris_background);
}

.navegacion_redes .caja_redes{
  width: 100%;
  height: 40px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  max-width: var(--ancho_base);
  padding: var(--relleno_fila);
  margin: auto;
  gap: 50px;
  color: var(--color_accent);
}

.navegacion_redes .caja_redes .area_redes{
  display: flex;
  align-items: flex-start;
  gap: 24px;
}

.navegacion_redes .caja_redes .area_redes a{
  color: var(--color_accent);
}

.navegacion_redes .caja_redes p{
  margin-bottom: 0px;
}

main section.seccion_redes {
  margin-top: var(--unidad_base);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--unidad) * 2);
  flex-wrap: wrap;
}

main section.seccion_redes .boton{
  margin-left: 0px;
}

/*Fin de Estilos para caja navegador*/

/*25.- Estilos para breadcrums*/

main nav.migas {
  padding: 8px var(--unidad_base);
}

main nav.migas a {
  color: var(--color_accent);
}

main nav.migas a:hover {
  color: var(--color_secundario);
}

main nav.migas a::after {
  content: "\002F";
  padding: 0px 4px;
  color: var(--color_accent);
  font-weight: 400;
}

/* main nav.breadcrumb a:last-child:after{
    content: " ";
} */

/*Fin de Estilos para breadcrums*/

/*26.- Estilos para escritos*/

.seccion_escritos{
  display: flex;
  flex-direction: column;
  width: min(100%, 720px);
  margin: auto;
  align-items: center;
  text-align: center;
}

.seccion_escritos .caja_tarjeta{
  margin-top: var(--unidad_base);
}

.seccion_escritos .contenido_escrito{
  margin-top: var(--unidad_base);
}

.seccion_escritos .seccion_redes{
  width: 100%;
  border-top: 1px solid var(--color_gris_background);
  border-bottom: 1px solid var(--color_gris_background);
}

.seccion_galeria{
  margin-top: var(--unidad_base);
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: var(--unidad_base);
}

.seccion_galeria img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: var(--redondez_base);
}

/*Fin de Estilos para escritos*/

/* .-Lineamiento para responsivo*/

/* Estilos para pantallas de 19" */
@media screen and (max-width: 1440px) {
}

/* Estilos para pantallas de 15" */
@media screen and (max-width: 1366px) {
}

/* Estilos para pantallas de 12" y 10" */
/*@media screen and (max-width: 1024px) {
  
}
*/
/* Estilos para tablet */
@media screen and (max-width: 1024px) {
  :root {
    --relleno_fila: 0px 8px;
  }
  .seccion_leyenda,
  .seccion_enlaces {
    padding: 16px 16px;
  }
  .seccion_enlaces .area_enlaces {
    flex-direction: column;
  }
  .seccion_enlaces .area_enlaces .col {
    margin-right: 0px;
    margin-bottom: 16px;
  }
  .seccion_enlaces .area_enlaces .col:last-of-type {
    margin-bottom: 0px;
  }
  .escudo_enlaces {
    display: none;
  }
  .caja_verificador .caja_acordeon .accordion-body .row {
    flex-direction: column;
    padding: 0px 0px;
  }
  .caja_verificador .caja_acordeon .accordion-body .col {
    max-width: 100%;
  }
  .caja_verificador .caja_acordeon .accordion-body .col + .col {
    margin-top: 16px;
  }
  .caja_header .logo_header {
    order: 2;
  }
  .caja_header #boton_hamburguesa {
    order: 1;
  }
  .caja_header .navbar-collapse {
    order: 4;
    padding: 8px 3px 0px 3px;
  }
  .caja_header #boton_login {
    order: 3;
  }
  .caja_header .navbar-toggler {
    padding-left: 0px;
    display: flex;
    align-items: center;
  }
  .caja_header .caja_busqueda {
    width: 100%;
  }
  .caja_header .caja_busqueda button {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
  }
  
  .tiene_logo img {
    height: 150px;
  }
  .caja_tabla.es_ajustada {
    margin-right: 0px;
    min-width: 100%;
  }

  #menu_vertical{
    height: calc(100vh - 97px);
  } 
  #menu_vertical ~ main {
    flex: none;
    top: 32px;
    bottom: 0;
    right: 0;
    padding-top: 64px !important;
    overflow: hidden;
    width: calc(100% - 80px);
    position: absolute;
    height: auto;
    min-height: auto;
    overflow-y: auto;
    }

    #menu_vertical ~ main .contenedor_general{
      height: auto;
      padding-left: var(--unidad_base);
      padding-right: var(--unidad_base);
    }

    .seccion_titulo{
      flex-wrap: wrap;
    }

    .seccion_titulo p{
      width: 100%;
      margin-left: 0px;
      margin-top: calc(var(--unidad)* 2);
    }

    .seccion_titulo p::before {
      content: '';
      position: absolute;
      top: -8px;
      right: 0;
      left: 0;
      width: 100%;
      height: 1px;
      background-color: var(--color_accent);
    }

    .descripcion {
      flex-direction: column;
    }

    .body_login{
      background-color: var(--color_primario);
    }
    .area_login{
      padding: 0px;
    }
    .es_izquierda .area_login{
      justify-content: center;
    }
    .es_derecha .area_login{
      justify-content: center;
    }
    .caja_terminos{
      color: var(--color_blanco);
    }
    .caja_login{
      padding-right: 8px;
      padding-left: 8px;
    }
    .caja_contraseña{
      flex-direction: column;
      align-items: flex-start;
    }
    .caja_contraseña .caja_checkbox {
      margin-bottom: 12px;
      margin-top: 0px;
    }
    .caja_contraseña .es_enlace{
      margin-bottom: 12px;
    }
    .tiene_fondo::before{
      content: none;
    }
    .tiene_fondo::after{
      content: none;
    }
    .es_horizontal {
      flex-direction:column !important;
    }
    .caja_tarjeta.es_horizontal.tiene_mascara .cuerpo_tarjeta{
      text-align: center;
      padding: 0px;
      width: 100% !important;
    }
    .caja_tarjeta.es_horizontal.tiene_mascara .imagen_tarjeta{
      width: 100%;
    }

    .caja_tarjeta.es_horizontal.tiene_mascara .imagen_tarjeta img{
      clip-path: url(#mascara_vertical) !important;
      aspect-ratio: 4/3;
      width: 100%;
      height: 100%;
    }

    .caja_tarjeta.es_horizontal.tiene_mascara svg{
        width: 100%;
        height: 100%;
    }
    .contenido_banner img {
        width: 100%;
        height: 150px;
        filter: sepia(1);
        opacity: 90%;
        position: absolute;
    }

    /* estilos responsiv para navtab es_completo */

    .es_completo {
      display: flex;
      justify-content: space-around !important;
      flex-direction: column;
      flex-wrap: nowrap;
    }

    .es_landing .nav-link::before {
      content: "";
      position: absolute;
      left: -1px;
      top: 0;
      bottom: 0;
      margin: auto;
      height: 34px;
      width: 0px;
      background: rgba(115, 131, 156, 0.2);
    }

    footer .seccion_redes{
      flex-direction: column-reverse;
      align-items: center;
    }

    footer .seccion_redes .area_escudo{
      padding-left: 0px;
    }

    footer .seccion_redes .area_redes{
      padding-right: 0px;
    }

    footer .seccion_redes .caja_redes{
      flex-direction: column-reverse;
      align-items: center;
    }

    footer .seccion_redes .caja_redes .area_escudo::before,
    footer .seccion_redes .area_escudo::before{
      content: '';
      display: block;
      position: relative;
      width: 100%;
      height: 1px;
      margin: 32px 0px;
      background-color: var(--color_gris_background);  
    }

    footer .seccion_redes .caja_redes .escudo_footer,
    footer .seccion_redes .escudo_footer{
      display: contents;
      margin: auto;
    }

/*    .caja_terminos .area_logos_login .logo_secretaria.es_administracion,
    .administracion .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/administracion_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_economia,
    .economia .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/economia_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_educacion,
    .educacion .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/educacion_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_ambiente,
    .ambiente .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/medio_ambiente_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_contraloria,
    .contraloria .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/contraloria_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_cultura,
    .cultura .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/cultura_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_agropecuario,
    .agropecuario .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/agropecuario_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_inclusion,
    .inclusion .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/igualdad_inclusion_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_movilidad,
    .movilidad .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/movilidad_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_mujeres,
    .mujeres .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/mujeres_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_participacion,
    .participacion .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/participacion_ciudadana_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_salud,
    .salud .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/salud_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_seguridad,
    .seguridad .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/seguridad_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_tesoreria,
    .tesoreria .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/tesoreria_blanco.svg);
    }*/

    .caja_terminos .area_logos_login .logo_secretaria.es_trabajo,
    .trabajo .caja_terminos .area_logos_login .logo_secretaria {
        /* background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/trabajo_blanco.svg);*/
        background-image: url(/images/logo_login_trabajo.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_turismo,
    .turismo .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/secretarias/turismo_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_estatal.es_background{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/logos/logo_estado_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_agua_drenaje,
    .agua_drenaje .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/otros_logos/servicios_agua_drenaje_monterrey_blanco.svg);
    }

    .caja_terminos .area_logos_login .logo_secretaria.es_nl_travel,
    .nl_travel .caja_terminos .area_logos_login .logo_secretaria{
        background-image: url(http://recursos.digital.nl.gob.mx/assets/img/otros_logos/nuevo_leon_travel_blanco.svg);
    }

    .caja_tarjeta.es_horizontal.tiene_mascara .corchete_fondo_movil{
        display: block;
    }

    .caja_tarjeta.es_horizontal.tiene_mascara .corchete_fondo{
        display: none;
    }

    .caja_banner.es_cuadricula .logo_secretaria_color{
      width: 100%;
      max-width: 300px;
    }
    .caja_banner.es_cuadricula > img{
      width: 100%;
      min-width: 360px;
      max-width: 360px;
    }
    .caja_tarjeta.es_horizontal.tiene_mascara.es_1a1 .imagen_tarjeta{
      text-align: center;
    }
    .caja_tarjeta.es_horizontal.tiene_mascara.es_1a1 .imagen_tarjeta img{
      width: auto;
      max-height: 600px;
      max-width: 100%;
    }
    .caja_tarjeta.es_horizontal.redonda_horizontal.es_1a1 .imagen_tarjeta{
      width: 100%;
      min-width: 100%;
      aspect-ratio: 1/1;
    }
    .caja_tarjeta.es_horizontal.redonda_horizontal.es_1a1.es_destacado .imagen_tarjeta{
      width: 100%;
      min-width: 100%;
    }
    .caja_tarjeta.redonda_horizontal .imagen_tarjeta{
      width: 100%;
      min-width: 100%;
    }
    .caja_tarjeta.es_horizontal.redonda_horizontal .cuerpo_tarjeta{
      width: 100%;
      padding: 32px 0px 0px 0px;
    }

    .caja_carrusel .caja_tarjeta.es_horizontal.redonda_horizontal .cuerpo_tarjeta{
      padding-bottom: calc(var(--unidad) * 7);
    }
    .caja_banner.es_cuadricula {
      margin-bottom: calc( var(--unidad) * 6);
    }
    .seccion_tarjetas.\33_columnas,
    .seccion_tarjetas.\34_columnas,
    .seccion_galeria{
      grid-template-columns: repeat(1,1fr);
    }
    .caja_navegador{
      min-width: 100%;
    }

}

/* Estilos para tablet 600px*/
@media screen and (max-width: 600px) {
}

/* Estilos para movil */
@media screen and (max-width: 375px) {

}

/*Fin de Lineamiento para responsivo*/
