
        .fontm{
          font-family:"Figtree";
          font-weight:400;
          font-style:normal;
        }
        html,body {
          height:100%; margin:0; padding:0; font-family:Arial,Helvetica,sans-serif;
        }
        body { background:#000; color:#fff; display:flex; overflow:hidden; }
        .screen {
          width:100vw;
          height:100vh;
          display:flex;
          position:absolute;
          align-items:center;
          justify-content:center;
          background-size:cover;
          background-position:center;
          text-align:center;
          transition:background 0.6s ease,opacity 0.6s ease;
          overflow:clip;
        }
        .screen::before{
          content:"";
          position:absolute;
          inset:0;
          background:rgba(8,24,47,.38);
          z-index:0;
        }

.section-header{
  display:flex;
  justify-content:space-between;
  background:linear-gradient(180deg,#0e1f49,#0e1f49);
  height:11vh;
  width:100%;
z-index:5;
  align-items:start;
  border-bottom:1px solid rgb(255 255 255 / 96%);
}
        .logo{
          display:flex;
          background:transparent;
          flex-direction:row;
          margin:3vw;
          margin-left:5vw;
          align-items:center;
          z-index:2;
          top:0;
          left:0;
          height:70%;
        }
        .logo img{
          height:100%;
          width:100%;
          background:transparent;
          border-radius:50%;
          overflow:clip;
        }
        .logoimg img{ object-fit:cover; height:100%; width:100%; }
        .time{
          height:100%;
          display:flex;
          align-items:center;
          margin-top:0vw;
          width:max-content;
          text-align:center;
          z-index:5;
          margin-right:5vw;

        }
        .time p{
          text-align:center;
          padding-left:5vw;
          padding-right:5vw;
          line-height:1.25;
          font-size:6vw;
          font-weight:500;
          color:#e4e4e0;
        }
        .overlay{
          z-index:1;
          height:100%;
          width:100%;
          padding-top:37vh;
          overflow:clip;
        }
        .title { font-size:7vw; font-weight:700; color:#efefef; }
        .count {
          font-size:20vw;
          margin:7vh 0 0;
          font-weight:700;
          color:#efefef;
        }
        .sub,.small{
          font-size:5.5vw;
          padding:5vw;
          margin-top:7vh;
          font-weight:700;
          color:#efefef;
        }
        .small{ font-size:7vw; }
        .overlay p{ margin:6px 0; }
        .count .gebet-name-live{ font-size:12vw; }

        /* Overview inside the same established screen/overlay structure. */
        .prayer-overview{
          width:88vw;
          margin:0 auto;
          padding:2.2vw 4vw 3vw;
          background:rgba(15,34,64,.80);
          border:.22vw solid rgba(228,228,224,.85);
        }
        .overview-title{
          margin:0 0 1.6vh !important;
          font-size:5.2vw;
          line-height:1.1;
          font-weight:700;
          color:#efefef;
        }
        .prayer-list{ display:flex; flex-direction:column; width:100%; }
        .prayer-row{
          display:flex;
          flex-direction:row;
          align-items:center;
          justify-content:space-between;
          min-height:8.2vh;
          padding:.6vh 2.5vw;
          border-top:.16vw solid rgba(228,228,224,.55);
        }
        .prayer-row:first-child{ border-top:0; }
        .prayer-name,.prayer-time{
          margin:0 !important;
          color:#efefef;
          font-size:4.7vw;
          line-height:1.15;
          font-weight:700;
        }
        .prayer-name{ text-align:left; }
        .prayer-time{ text-align:right; min-width:20vw; }
        .info-message{
          position:absolute;
          z-index:20;
          top:90%;
          font-size:3vw;
          margin-left:5%;
          padding:1vw 2vw;
          background:rgba(120,16,16,.94);
        }