* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  --colorAmarilloIphone: #e9ff70;
  --colorAzul: #01345b;
  --colorAzulClaro: cyan;
  --colorAzulLinks: #0288d1; /* #01579b; Sacado de: https://colorswall.com/palette/13/ */
  --colorAzulLinksHover: #039be5;
  --colorAzulMuyOscuro: #0b121f;
  --colorBlanco: #ffffff;
  --colorCasiBlanco: #eff3f6;
  --colorGrisClaro: #ececec;
  --colorGrisBorde: #d5d8db;
  --colorGrisMuyOscuro: #222222;
  --colorNaranja: #ff7f00;

  --colorBordeOpcionNueva: var(--colorGrisBorde);
  --colorBordeOpcionNuevaHover: var(--colorAzulMuyOscuro);
  --colorBordeCVJA: var(--colorAzulMuyOscuro);

  --colorFondoBotonBuscarTexto: var(--colorAzul);
  --colorFondoBotonNuevaBusqueda: var(--colorAzulMuyOscuro);
  --colorFondoBotonVerMas: var(--colorAzul);
  --colorFondoBotonVerMasHover: var(--colorAzulMuyOscuro);
  --colorFondoCVJA: var(--colorAzul);
  --colorFondoCVJAHover: var(--colorGrisClaro);
  --colorFondoConcordancias: #cbd7e1; /* Sacado de: https://co.pinterest.com/pin/816699713663926097/ */
  --colorFondoIDEntidad: var(--colorFondoOpcionNueva);
  --colorFondoIDEntidadHover: var(--colorFondoOpcionNuevaHover);
  --colorFondoIDTipoDocumento: var(--colorFondoOpcionNueva);
  --colorFondoIDTipoDocumentoHover: var(--colorFondoOpcionNuevaHover);
  --colorFondoLegislacionAnterior: #f9f29c;
  --colorFondoNotasVigencia: #b3e5f6;
  --colorFondoOpcionNueva: var(--colorBlanco);
  --colorFondoOpcionNuevaHover: var(--colorGrisClaro);
  --colorFondoSelector: var(--colorAzul);
  --colorFondoTituloPanel: var(--colorAzul);
  --colorLinks: var(--colorAzulLinks);
  --colorLinksHover: var(--colorAzulLinksHover);

  --colorTextoBotonMateria: var(--colorAzulMuyOscuro);
  --colorTextoBotonOpcionNivel01: var(--colorAzulMuyOscuro);
  --colorTextoBotonOpcionNivel01Hover: var(--colorAzulMuyOscuro);
  --colorTextoBotonVerMas: var(--colorBlanco);
  --colorTextoBotonVerMasHover: var(--colorBlanco);
  --colorTextoCVJA: var(--colorBlanco);
  --colorTextoCVJAHover: var(--colorAzulMuyOscuro);
  --colorTextFooter: var(--colorCasiBlanco);
  --colorTextoIDDocumento: var(--colorTextoTituloOpcionNueva);
  --colorTextoIDDocumentoHover: var(--colorTextoTituloOpcionNuevaHover);
  --colorTextoIDEntidad: var(--colorTextoTituloOpcionNueva);
  --colorTextoIDEntidadHover: var(--colorTextoTituloOpcionNuevaHover);
  --colorTextoIdOpcionNivel01: var(--colorAzulMuyOscuro);
  --colorTextoIdOpcionNivel01Hover: var(--colorAzulMuyOscuro);
  --colorTextoRespuesta: var(--colorAzulMuyOscuro);
  --colorTextoTituloOpcionNueva: var(--colorAzulMuyOscuro);
  --colorTextoTituloOpcionNuevaHover: var(--colorAzulMuyOscuro);



  --colorGris: #777777;
  --colorGrisMiga: #999999;
  --colorMiga: #999999;
  --colorMigaActiva: #999999;
  --colorNegro: #000000;
  --colorTextoBotonDocumento: #000000;
  --colorTextoBotonOpcion: #ffffff;
  --colorTextoBotonTipoDocumento: #ffffff;
  --fondoExplicacion: #06233d;
  --fondoFooter: #1a1e2a;
  --fondoMenuNavegacion: #06233d;
  --fondoNavegacionLogo: #01345b;
  --fondoNavegacionMigas: #ffffff;
  --fondoOpcionNueva: #0b121f;
  --fondoVerMas: #a2b637;

  --bordeAzulClaro: #0074D5;
  --bordeAzulOscuro: #20479D;
  --bordeBotonVisor: #D8D8D8;
  --bordeGrisClaro: #D3D8DB;
  --bordeGris: #D5D8DB;
  --bordePanelDocumento: #D4D8DB;
  --casiNegro: #4d4d4d;
  --colorAzulOscuro: #20479D;
  --colorCornisaClaro: #8dc000;
  --colorCornisaNormal: #3cae48;
  --colorCornisaOscuro: #1d5f33;
  --colorGrisOscuro: #4d4d4d;
  --colorLetrasAlfabeto: #ffffff;
  --colorLetrasAlfabetoHover: #ffffff;
  --colorPanelFondoDocumento: #FAFBFC;
  --colorRojo: #EC1D24;
  --colorTextoBotonEntidad: #4d4d4d;
  --colorTextoEnlace: #20479D;
  --colorTextoEnlaceHover: #EC1D24;
  --colorTextoGeneral: #4d4d4d;
  --colorTextoTituloLetraAlfabeto: #ffffff;
  --colorTextoTituloSeccionMenuLateral: #b0b3b5;
  --colorVerdeSNS: #198820;
  --destacados: #727475;
  --fondoAzulClaro: #0074D5;
  --fondoAzulNoche: #132B5E;
  --fondoAzulOscuro: #20479D;
  --fondoBlanco: #FFFFFF;
  --fondoBotonBusqueda: #1d5f33;
  --fondoBotonNuevaBusqueda: #3cae48;
  --fondoBotonSencillo: #F5F8FA;
  --fondoBotonVerde: #205e35;
  --fondoGeneral: #F7F7F7;
  --fondoGrisAzuloso: rgba(24,69,163,0.1);
  --fondoGrisCasiBlanco: #FAFBFC;
  --fondoGrisClaro: #EFF3F6;
  --fondoGrisLinearGradient: #F2F4F7;
  --fondoGrisMenosClaro: #EEF3F6;
  --fondoIcono: #EFF3F6;
  --fondoLetrasAlfabeto: #a2b637;
  --fondoLetrasAlfabetoHover: #4d4d4d;
  --fondoNormograma: #198820;
  --fondoOpcionNuevaHover: #d2f0d5;
  --fondoRojo: #EC1D24;
  --fondoTituloLetraAlfabeto: #a2b637;
  --fondoTituloPanel: #198820; /* Título de páneles correspondientes a botones del visor */
  --outlineAzulOscuro: #20479D;
  --outlineCasiNegro: #343536;
  --outlineRojo: #ec1d24;

  --colorBackgroundBotonVerMas: var(--colorAzul);
  --colorBackgroundBotonVerMasHover: var(--colorAzulMuyOscuro);
  --colorBackgroundImagenRespuesta: var(--colorBlanco);
  --colorBackgroundImagenRespuestaHover: var(--colorGrisClaro);
  --colorBackgroundMigas: var(--colorBlanco);
  --colorBackgroundBotonOpcionNivel01: var(--colorBlanco);
  --colorBackgroundBotonOpcionNivel01Hover: var(--colorGrisClaro);
  --colorBackgroundPanelRespuesta: var(--colorBlanco);
  --colorBackgroundPanelRespuestaHover: var(--colorGrisClaro);
  --colorBackgroundTextoRespuesta: var(--colorBlanco);
  --colorBackgroundTituloKeywords: var(--colorAmarilloIphone);
  --colorBackgroundTituloMagistrado: var(--colorAmarilloIphone);
  --colorBackgroundTituloPalabrasClaves: var(--colorNaranja);
  --colorBackgroundTituloResumenAutomatizado: var(--colorNaranja);
  --colorBackgroundTituloSintesisCaso: var(--colorAmarilloIphone);
  --colorBackgroundTituloSumilla: var(--colorAmarilloIphone);
  --colorBackgroundTituloYear: var(--colorBlanco);

  --colorTextoMiga: var(--colorGris); /* Es el color normal de las migas */
  --colorTextoMigaActiva: var(--colorGrisMiga); /* Es la miga que tiene <a hred ... */
  --colorTextoTituloKeywords: var(--colorNegro);
  --colorTextoTituloMagistrado: var(--colorNegro);
  --colorTextoTituloPalabrasClaves: var(--colorBlanco);
  --colorTextoTituloResumenAutomatizado: var(--colorBlanco);
  --colorTextoTituloSumilla: var(--colorNegro);
  --colorTextoTituloSintesisCaso: var(--colorNegro);

  --multiplicadorLetra: 1;
  --letra12: calc(12px * var(--multiplicadorLetra));
  --letra14: calc(14px * var(--multiplicadorLetra));
  --letra15: calc(15px * var(--multiplicadorLetra));
  --letra16: calc(16px * var(--multiplicadorLetra));
  --letra18: calc(18px * var(--multiplicadorLetra));
  --letra20: calc(20px * var(--multiplicadorLetra));
  --letra22: calc(22px * var(--multiplicadorLetra));
  --letra24: calc(24px * var(--multiplicadorLetra));
  --letra26: calc(26px * var(--multiplicadorLetra));
  --letra32: calc(32px * var(--multiplicadorLetra));
  --letra36: calc(36px * var(--multiplicadorLetra));

  --letraBotonDescripcionDocumentoNormal: var(--letra16);
  --letraBotonDescripcionDocumentoSmall: var(--letra14);
  --letraBotonReferenciaADocumentoNormal: var(--letra18);
  --letraBotonReferenciaADocumentoSmall: var(--letra16);
  --letraOpcionNivel01Normal: var(--letra16);
  --letraOpcionNivel01Small: var(--letra14);
  --letraOpcionNuevaNormal: var(--letra16);
  --letraOpcionNuevaSmall: var(--letra14);
  --letraYearsNormal: var(--letra16);
  --letraYearsSmall: var(--letra14);

  font-family: 'Source Sans Pro', sans-serif;
  font-size: var(--letra18);
  color: var(--casiNegro);
  font-weight: 400;
  height: 100%;
}

/* Scrollbar styled */
/* https://css-tricks.com/the-current-state-of-styling-scrollbars/ */

html {
  --scrollbarBG: #132B5E;
  --thumbBG: #FFFFFF;
}

html {
  --scrollbarBG: #CFD8DC;
  --thumbBG: #90A4AE;
}

html {
  --scrollbarBG: darkgrey;
  --thumbBG: slategrey;
}

html {
  --scrollbarBG: #F5F5F5;
  --thumbBG: rgba(0,0,0,0.2);
  --altoPanelDocumento: 1754px; /* 1754px Tamaño para A4 con 150PPI -https://www.papersizes.org/a-sizes-in-pixels.htm- */
  --altoPanelFondoDocumento: 1814px; /* --altoPanelDocumento + 30px de margen de panel-documento * 2 */
}

/* -> Scrollbar styled */

body{
  min-height:100%;
  padding:0;
  margin:0;
  position:relative;
}

body {
  background-color: var(--fondoGeneral);
}

body::after {
  content: '';
  display: block;
  height: 610px; /* Set same as footer's height */  /* 60px + 550px */
}

@media screen and (min-width: 400px) {
  body::after {
    height: 580px; /* 60px + 520px */
  }
}

@media screen and (min-width: 992px) {
  body::after {
    height: 350px; /* 60px + 290px */
  }
}

@media screen and (min-width: 1100px) {
  body::after {
    height: 340px; /* 60px + 280px */
  }
}

@media screen and (min-width: 1876px) {
  body::after {
    height: 330px; /* 60px + 270px */
  }
}

body.busy-cursor {
  cursor: progress;
}


/* Scrollbar styled */

::-webkit-scrollbar {
  width: 11px;
}

body {
  scrollbar-width: thin;
  scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}

::-webkit-scrollbar-track {
  background: var(--scrollbarBG);
}

::-webkit-scrollbar-thumb {
  background-color: var(--thumbBG) ;
  border-radius: 6px;
  border: 3px solid var(--scrollbarBG);
}

/* -> Scrollbar styled */