body {
    background-color: white;
    background-image: none;
    color: black;
    text-align: center;
    font-family: sans-serif
}

table {
    margin-left: auto;
    margin-right: auto;
    text-align: left
}

.center-table {
  font-size: 1.4em;
  /* Step 1: Set a specific width for the table (must be less than 100%) */
  /* width: 40%; */
  
  /* Step 2: Set the left and right margins to 'auto' for centering */
  margin-left: auto;
  margin-right: auto;
  
  /* Shorthand for margin: 10px auto; (10px top/bottom, auto left/right) */
  /* margin: 10px auto; */
}

.left-aligned-cell {
  font-size: 0.8em;
  text-align: left; 
}

.right-aligned-cell {
  font-size: 0.8em;
  text-align: right;
}

.tempnow {
    color:red;
    font-size:2em;
    margin-top: 1em;
    /* https://css-tricks.com/how-to-create-neon-text-with-css/ */
    /*    text-shadow: [x-offset] [y-offset] [blur-radius] [color]; */
    text-shadow: 1px 1px black, 3px 3px 5px grey;
    /* border-bottom: 1px solid transparent; */
    -webkit-text-stroke: 0.3px black;
}

.tempnowcold {
    color:red;
    font-size:2em;
    margin-top: 1em
}

.tempnowwarm {
    color:blue;
    font-size:2em;
    margin-top: 1em
}

.temp24h {
    font-size:1.5em
}

a:link,a:visited {
    text-decoration: underline;
    color: #01499A
}

@media screen {
    .navig {
        position: absolute;
        top: 0.5em;
        left: 0.5em;
        text-align: left
    }
}

@media print {
    .navig {
        display: none
    }
}

.fade-blink {
  /* Note: Removed 'steps(1, end)' for a smooth transition */
  animation: fade-blinker 4s infinite; 
}

@keyframes fade-blinker {
  /* Start fully visible */
  0% { 
    opacity: 1;
    /* font-size: 1em; */
  } 

  /* Slowly fade out over 1.5 seconds */
  50% { 
    opacity: 0.95;
    color: #FF0000;
    /* font-size: 1.2em; */
    text-shadow: 1px 1px black, 1px 1px 1px grey;
  } 

  /* Hold visible state for the remaining time */
  100% { 
    opacity: 1;
    /* font-size: 1em; */
  }
}