body{
    background-image: url('assets/pattern.jpg');
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.navbar-brand img{
    max-height: 70px;
}
.carousel-caption{
    color: #025A3A;
}
footer.container-fluid{
    background-color: #025A3A;
    color:white;
    margin-top: auto;
}
footer.container-fluid img{
    max-height: 30px;
}


.header-2 img, .header-picture{
    max-height: 50px;
    padding-top:2px;
    padding-right: 10px;
}

.header-2{
    border-bottom: 2px solid #025A3A;
    padding: 5px;
    margin-top:100px;
}
    .header-2 img{
        max-height: 30px;
        padding-top:2px;
        padding-right: 10px;
    }

    .tag-line{
        color:#025A3A;
        font-weight: bold;
        font-size: 15pt;
        font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    }

/* Report page title */
.report-title{
    font-size: 18pt;
}

.back-to-home{
    max-height: 40px;
    margin-top:10px;
}

/* Make it a marquee */
.marquee2 {
    width:100%;
    margin: 0 auto;
    white-space: nowrap;
    overflow: hidden;
    text-align: right;
}

.marquee2 span.marquee-text {
    display: inline-block;
    animation-name: marquee;
    /* animation-duration: 50s; */
    /* animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-direction: reverse; */

    /* -moz-transform: translateX(100%);
    -webkit-transform: translateX(100%);
    transform: translateX(100%); */
    -moz-animation: scroll-left 2s linear infinite;
    -webkit-animation: scroll-left 2s linear infinite;
    animation: scroll-left 40s linear infinite;
}

/* Make it move */
@-moz-keyframes scroll-left {
    0% {
        -moz-transform: translateX(0%);
    }
    100% {
        -moz-transform: translateX(-100%);
    }
}

@-webkit-keyframes scroll-left {
    0% {
        -webkit-transform: translateX(0%);
    }
    100% {
        -webkit-transform: translateX(-100%);
    }
}

@keyframes scroll-left {
    0% {
        -moz-transform: translateX(50%);
        -webkit-transform: translateX(50%);
        transform: translateX(50%);
    }
    100% {
        -moz-transform: translateX(-100%);
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }
}



/* Loader */
/* HTML: <div class="loader"></div> */
.loader {
    width: fit-content;
    font-weight: bold;
    font-family: monospace;
    font-size: 20px;
    clip-path: inset(0 3ch 0 0);
    animation: l4 1s steps(4) infinite;
  }
  .loader:before {
    content:"AI Engine In Progress..."
  }

  .loader-ai {
    width: fit-content;
    font-weight: bold;
    font-family: monospace;
    font-size: 20px;
    clip-path: inset(0 3ch 0 0);
    animation: l4 1s steps(4) infinite;
  }
  .loader-ai:before {
    content:"AI Engine is Firing Up..."
  }
  @keyframes l4 {to{clip-path: inset(0 -1ch 0 0)}}
  

  /* table foot note */
  .table-foot-note{
      font-size:10pt;
  }


/* Data tables */
.tableDistrict tr td{
    text-align: right;
}
.tableDistrict tr td:nth-child(1){
    text-align: left;
}

.tableTopic tr td:nth-child(1), .tablePolitical tr td:nth-child(1),
.tableTopic tr th:nth-child(1), .tablePolitical tr th:nth-child(1){
    text-align: center;
    /* min-width: 150px; */
}
.tableTopic tr td:nth-child(2), .tablePolitical tr td:nth-child(2),
.tableTopic tr th:nth-child(2), .tablePolitical tr th:nth-child(2){
    width:70%;
}
.tableTopic tr td:nth-child(3), .tablePolitical tr td:nth-child(3),
.tableTopic tr th:nth-child(3), .tablePolitical tr th:nth-child(3){
    text-align: right;
    overflow: hidden;
    /* min-width: 150px; */
}
.tableTopic tr td:nth-child(4), .tablePolitical tr td:nth-child(4),
.tableTopic tr th:nth-child(4), .tablePolitical tr th:nth-child(4){
    text-align: right;
    /* overflow: hidden; */
}
.tableTopic tr td:nth-child(5), .tablePolitical tr td:nth-child(5),
.tableTopic tr th:nth-child(5), .tablePolitical tr th:nth-child(5){
    /* width:10%; */
    
}

/* HTML: <div class="td-loader"></div> */
.td-loader {
    width: 15px;
    aspect-ratio: 1;
    --c: no-repeat linear-gradient(#0D6EFD 0 0);
    background: 
      var(--c) 0%   50%,
      var(--c) 50%  50%,
      var(--c) 100% 50%;
    background-size: 20% 100%;
    animation: l1 1s infinite linear;
  }
  @keyframes l1 {
    0%  {background-size: 20% 100%,20% 100%,20% 100%}
    33% {background-size: 20% 10% ,20% 100%,20% 100%}
    50% {background-size: 20% 100%,20% 10% ,20% 100%}
    66% {background-size: 20% 100%,20% 100%,20% 10% }
    100%{background-size: 20% 100%,20% 100%,20% 100%}
  }