@font-face {
    font-family: Courier;
    src: url("/static/fonts/cour.5bc234e37ee1.ttf");
  }

  @font-face {
    font-family: CourierBold;
    src: url("/static/fonts/courbd.69a8f2205db4.ttf");
    font-weight: bold;
  }

  @font-face {
    font-family: ComicSans;
    src: url("/static/fonts/ComicSans/ComicSans.383a8d043343.ttf");
  }

  @font-face {
    font-family: UbuntuBold;
    src: url("/static/fonts/Ubuntu-Bold.e00e2a77dd88.ttf");
    font-weight: bold;
  }

  @font-face {
    font-family: Ubuntu;
    src: url("/static/fonts/Ubuntu-Regular.2505bfbd9bde.ttf");
  }

  @font-face {
    font-family: SegoeUI;
    src: url("/static/fonts/segoeui.d9076ed73f25.ttf");
  }

  @font-face {
    font-family: SegoeUIBold;
    src: url("/static/fonts/segoeuib.299556cecd6b.ttf");
  }


  :root {
    --unolet-white: #ffffff;
    --unolet-black: #454545;
    --unolet-gray: #757575;
    --unolet-red: #ff0000;
    --light2: rgb(238, 239, 240);
  }



  html {
    scroll-behavior: smooth;
  }


  body {
    background-color: #fff;
  }


  fieldset {
    border: 1px groove #aaa;
    background: #eee;
    padding: 5px;
  }


  .semi-circulo-2 {
    -moz-border-radius: 0 100px 100px 0;
    -webkit-border-radius: 0 100px 100px 0;
    border-radius: 0 100px 100px 0;
  }

  /*
    Oculta el elemento pasado 7 segundos.
    Utiliza https://animate.style/
  */
  .hide_in_7sec {
    opacity: 1;
    animation: bounceOut 1s forwards;
    animation-delay: 7s;
  }


  /*
  to-hover: elemento padre que al pasar el mouse mostrará su hijo que tenga la clase .to-show
  to-show: elemento hijo de to-hover que será mostrado al pasar el mouse por el padre.
  */
  .to-hover:hover > .to-show {
    display: initial;
  }
  .to-show {
    display: none;
  }

  /*
  Botones con imágenes.
  */

  .btn img {
    width: auto;
    height: 20px;
    padding-left: 3px;
    padding-right: 3px;
  }

  .btn-lg img {
    width: auto;
    height: 24px;
  }

  .btn-white {
    background-color: white;
    color: var(--bs-dark);
  }

  .btn-white:hover {
    background-color: #eee;
  }

  .btn-semitransparent {
    opacity: 0.5 !important;
  }

  .btn-semitransparent:hover {
    opacity: 1 !important;
  }

  .btn-light:hover {
    background-color: #ccc;
  }


  .messages .alert {
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175);
  }


  /*
  Tablas.
  */

  .table {
    background-color: #fff;
  }

  .table td img {
    height: 1rem;
    width: 1rem;
  }

  .table td:only-child(img) {
    text-align: center;
  }

  .table-hover tbody tr {
    cursor: pointer;
  }

  /* Requerido por la librería table-hover.js */
  .table-hover tbody tr:focus {
    background-color: #75757580;
    color: black;
    outline: none;
    /*text-shadow: 0.5px 0.5px #00000077;*/
  }

  .table thead th .btn-link {
    color: #454545;
  }


  /*
    Tamaños
  */

  .w-10 {
    width: 10% !important;
  }

  .w-20 {
    width: 20% !important;
  }



  .w-1px {
    width: 1px !important;
  }

  .w-2px {
    width: 2px !important;
  }

  .w-4px {
    width: 4px !important;
  }

  .w-8px {
    width: 8px !important;
  }

  .w-16px {
    width: 16px !important;
  }

  .w-24px {
    width: 24px !important;
  }

  .w-32px {
    width: 32px !important;
  }

  .w-48px {
    width: 48px !important;
  }

  .w-64px {
    width: 64px !important;
  }

  .w-128px {
    width: 128px !important;
  }

  .w-256px {
    width: 256px !important;
  }

  .w-320px {
    width: 320px !important;
  }

  .w-384px {
    width: 384px !important;
  }

  .w-448px {
    width: 448px !important;
  }

  .w-512px {
    width: 512px !important;
  }

  .w-640px {
    width: 640px !important;
  }

  .w-768px {
    width: 768px !important;
  }

  .w-1024px {
    width: 124px !important;
  }


  .h-10 {
    height: 10% !important;
  }

  .h-20 {
    height: 20% !important;
  }

  .h-1px {
    height: 1px !important;
  }

  .h-2px {
    height: 2px !important;
  }

  .h-4px {
    height: 4px !important;
  }

  .h-8px {
    height: 8px !important;
  }

  .h-16px {
    height: 16px !important;
  }

  .h-24px {
    height: 24px !important;
  }

  .h-32px {
    height: 32px !important;
  }

  .h-48px {
    height: 48px !important;
  }

  .h-64px {
    height: 64px !important;
  }

  .h-80px {
    height: 80px !important;
  }

  .h-96px {
    height: 96px !important;
  }

  .h-112px {
    height: 112px !important;
  }

  .h-128px {
    height: 128px !important;
  }

  .h-192px {
    height: 192px !important;
  }

  .h-256px {
    height: 256px !important;
  }

  .h-320px {
    height: 320px !important;
  }

  .h-384px {
    height: 384px !important;
  }

  .h-448px {
    height: 448px !important;
  }

  .h-512px {
    height: 512px !important;
  }

  .h-640px {
    height: 640px !important;
  }

  .h-768px {
    height: 768px !important;
  }

  .h-1024px {
    height: 1024px !important;
  }


  @media (min-width: 576px) {
    .w-md-10 {
      width: 10% !important;
    }

    .w-md-20 {
      width: 20% !important;
    }


    .w-md-1px {
      width: 1px !important;
    }

    .w-md-2px {
      width: 2px !important;
    }

    .w-md-4px {
      width: 4px !important;
    }

    .w-md-8px {
      width: 8px !important;
    }

    .w-md-16px {
      width: 16px !important;
    }

    .w-md-24px {
      width: 24px !important;
    }

    .w-md-32px {
      width: 32px !important;
    }

    .w-md-48px {
      width: 48px !important;
    }

    .w-md-64px {
      width: 64px !important;
    }

    .w-md-128px {
      width: 128px !important;
    }

    .w-md-256px {
      width: 256px !important;
    }

    .w-md-320px {
      width: 320px !important;
    }

    .w-md-384px {
      width: 384px !important;
    }

    .w-md-448px {
      width: 448px !important;
    }

    .w-md-512px {
      width: 512px !important;
    }

    .w-md-640px {
      width: 640px !important;
    }

    .w-md-768px {
      width: 768px !important;
    }

    .w-md-1024px {
      width: 124px !important;
    }


    .h-md-10 {
      height: 10% !important;
    }

    .h-md-20 {
      height: 20% !important;
    }

    .h-md-1px {
      height: 1px !important;
    }

    .h-md-2px {
      height: 2px !important;
    }

    .h-md-4px {
      height: 4px !important;
    }

    .h-md-8px {
      height: 8px !important;
    }

    .h-md-16px {
      height: 16px !important;
    }

    .h-md-24px {
      height: 24px !important;
    }

    .h-md-32px {
      height: 32px !important;
    }

    .h-md-48px {
      height: 48px !important;
    }

    .h-md-64px {
      height: 64px !important;
    }

    .h-md-80px {
      height: 80px !important;
    }

    .h-md-96px {
      height: 96px !important;
    }

    .h-md-112px {
      height: 112px !important;
    }

    .h-md-128px {
      height: 128px !important;
    }

    .h-md-192px {
      height: 192px !important;
    }

    .h-md-256px {
      height: 256px !important;
    }

    .h-md-320px {
      height: 320px !important;
    }

    .h-md-384px {
      height: 384px !important;
    }

    .h-md-448px {
      height: 448px !important;
    }

    .h-md-512px {
      height: 512px !important;
    }

    .h-md-640px {
      height: 640px !important;
    }

    .h-md-768px {
      height: 768px !important;
    }

    .h-md-1024px {
      height: 1024px !important;
    }
  }



  .unolet-font {
    font-family: 'Courier New';
  }


  /*
  Colores, Opacidad...
  */

  /* Colores de la línea gráfica de Unolet. */
  .unolet-bg-white {
    background-color: var(--unolet-white);
  }

  .unolet-bg-gray {
    background-color: var(--unolet-black);
  }

  .unolet-bg-gray-light {
    background-color: var(--unolet-gray);
  }

  .unolet-bg-red {
    background-color: var(--unolet-red);
  }

  .unolt-text-white {
    color: var(--unolet-white);
  }

  .unolet-text-gray {
    color: var(--unolet-black);
  }

  .unolet-text-gray-light {
    color: var(--unolet-gray);
  }

  .unolet-text-red {
    color: var(--unolet-red);
  }

  .bg-light2 {
    background-color: var(--light2);
  }


  .opacity-1 {
    opacity: 0.1;
  }

  .opacity-2 {
    opacity: 0.2;
  }

  .opacity-3 {
    opacity: 0.3;
  }

  .opacity-4 {
    opacity: 0.4;
  }

  .opacity-5 {
    opacity: 0.5;
  }

  .opacity-6 {
    opacity: 0.6;
  }

  .opacity-7 {
    opacity: 0.7;
  }

  .opacity-8 {
    opacity: 0.8;
  }

  .opacity-9 {
    opacity: 0.9;
  }

  .opacity-10 {
    opacity: 1;
  }

  .opacity-1-hover:hover {
    opacity: 0.1;
  }

  .opacity-2-hover:hover {
    opacity: 0.2;
  }

  .opacity-3-hover:hover {
    opacity: 0.3;
  }

  .opacity-4-hover:hover {
    opacity: 0.4;
  }

  .opacity-5-hover:hover {
    opacity: 0.5;
  }

  .opacity-6-hover:hover {
    opacity: 0.6;
  }

  .opacity-7-hover:hover {
    opacity: 0.7;
  }

  .opacity-8-hover:hover {
    opacity: 0.8;
  }

  .opacity-9-hover:hover {
    opacity: 0.9;
  }

  .opacity-10-hover:hover {
    opacity: 1;
  }



  /* -----------------------------------------------------------------------------
   Positions.
  ------------------------------------------------------------------------------*/

  .z-index-1000 {
    z-index: 1000;
  }

  .z-index-2000 {
    z-index: 2000;
  }

  .z-index-3000 {
    z-index: 3000;
  }

  .z-index-4000 {
    z-index: 4000;
  }

  .z-index-5000 {
    z-index: 5000;
  }

  .top {
    top: 0;
  }

  .bottom {
    bottom: 0;
  }

  .left {
    left: 0;
  }

  .right {
    right: 0;
  }


  /* -----------------------------------------------------------------------------
   Misceláneos.
  ------------------------------------------------------------------------------*/

  .cursor-pointer {
    cursor: pointer;
  }

  .totales {
    font-weight: bold;
  }

  tr.totales td,
  tr.totales th {
    background-color: rgba(150, 150, 150, 0.3);
    color: black;
    text-align: right;
  }

  tfoot.totales td,
  tfoot.totales th {
    background-color: rgba(150, 150, 150, 0.3);
    color: black;
    text-align: right;
  }


  .enfasis {
    background-color: rgba(255, 187, 0, 0.5) !important;
    font-weight: bold !important;
  }

  tr.enfasis td {
    background-color: rgba(255, 187, 0, 0.5) !important;
    font-weight: bold !important;
  }

  tr.enfasis th {
    background-color: rgba(255, 187, 0) !important;
    font-weight: bold !important;
  }

  .CharField {
    text-align: left;
  }

  .TextField {
    text-align: left;
  }

  .DecimalField {
    text-align: right !important;
  }

  .IntegerField {
    text-align: right !important;
  }

  .FloatField {
    text-align: right !important;
  }

  .BooleanField {
    /**/
  }



  /***********************************************************
  SOBRESCRITOS DE LIBRERÍAS EXTERNAS.
  ***********************************************************/

  /*
      Bootstrap
  */


  body,
  .btn,
  .form-control,
  .form-select,
  .form-control-plaintext,
  .dropdown-menu,
  .input-group-text,
  .custom-select,
  .popover-header,
  .table {
    /* el tamaño por defecto en Bootstrap es 1rem */
    font-size: 0.9rem;
  }

  /* En Bootstrap 5, el texto de ayuda en los checkbox dejó de ponerse en la línea de abajo, y aquí lo corregimos. */
  .form-check small.form-text {
    display: block;
  }


  .nav-item .nav-link {
    color: #454545;
  }


  h1,
  .h1 {
    font-size: 1.4rem;
  }

  h2,
  .h2 {
    font-size: 1.3rem;
  }

  h3,
  .h3 {
    font-size: 1.2rem;
  }

  h4,
  .h4 {
    font-size: 1.1rem;
  }

  h5,
  .h5 {
    font-size: 1rem;
  }

  h6,
  .h6 {
    font-size: 0.9rem;
  }



  .fs-xsmall {
    font-size: 0.5rem;
  }

  .fs-small {
    font-size: 0.7rem;
  }

  small {
    font-size: 0.7rem !important;
  }

  .fs-normal {
    font-size: 0.9rem;
  }

  .fs-large {
    font-size: 1.1rem;
  }

  .fs-xlarge {
    font-size: 1.3rem;
  }


  .table thead th {
    text-align: center;
  }


  /*
      Códigos de la aplicación: django-autocomplete-light
  */


  .select2-container {
    /* min-width: 20em; *** Original. */
    min-width: auto !important;
    width: 100% !important;
  }

  .select2-container .select2-selection--single {
    /*
      Original:
      box-sizing: border-box;
      cursor: pointer;
      display: block;
      height: 28px;
      user-select: none;
      -webkit-user-select: none;
      */
    height: 35px !important;
  }

  .select2-container--default .select2-selection--single .select2-selection__arrow {
    /*
      Orignal:
      height: 28px;
      position: absolute;
      top: 1px;
      right: 1px;
      width: 20px;
      */
    height: 100% !important;
  }

  .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #444;
    line-height: 20px !important;
  }

  .select2-container .select2-selection--single .select2-selection__rendered {
    /*
      Original:
      display: block;
      padding-left: 8px;
      padding-right: 20px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      */
    padding-left: 0px !important;
    padding-right: 0px !important;
  }

  .select2-container--open {
    /*z-index: 1056 !important; /* Resuelve un problema cuando se muestra en bootstrap modal. Bootstrap modal es 1055*/
  }


  /*
      Para impresiones.
  */

  @media print {
    @page {
      size: letter;
    }

    html {
      font-size: 10pt;
    }

    body,
    .btn,
    .form-control,
    .form-control-plaintext,
    .dropdown-menu,
    .input-group-text,
    .custom-select,
    .popover-header,
    table {
      /* el tamaño por defecto en Bootstrap es 1rem */
      font-size: 1rem;
    }

    .no-break {
      page-break-inside: avoid;
    }

    .page-break-before {
      page-break-before: always;
    }

    body,
    header,
    main,
    section,
    footer,
    .btn,
    .form-control,
    .form-control-plaintext,
    .dropdown-menu,
    .input-group-text,
    .custom-select,
    .popover-header,
    table,
    .table {
      font-size: 0.9rem !important;
      /* el tamaño por defecto en Bootstrap es 1rem */
      background-color: white !important;
      color: black;
    }

    h1,
    .h1 {
      font-size: 1.6rem !important;
    }

    h2,
    .h2 {
      font-size: 1.5rem;
    }

    h3,
    .h3 {
      font-size: 1.4rem;
    }

    h4,
    .h4 {
      font-size: 1.3rem;
    }

    h5,
    .h5 {
      font-size: 1.2rem;
    }

    h6,
    .h6 {
      font-size: 1.1rem;
    }
  }