.themea {--bg: #92759f;--innerbg: #b0ae87;--accent: #ba7b4e;--text: #03061c;
    --db: #98aec2;--notice: #ddff00 ;--warning: #ff14b8;--shadow: #43454a;}
.themeb {--bg: #7a9f75;--innerbg: #aaaa95;--accent: #4e5aba;--text: #03061c;
    --db: #98aec2;--notice: #145cae ;--warning: #ff5a14;--shadow: #43454a;}
.themec{--bg: #0a1128;--innerbg: #031b44;--accent: #0f4857;--text: #fefcfb;
    --db: #034078;--notice: #14aeae ;--warning: #ff1414;--shadow: #43454a ;}

body { background: var(--bg);color: var(--text);font-family: Calibri,Cambria;
    margin-top: 1em;padding: 0.5em;line-height: 1.6;}

html, body { max-width: 100vw; overflow-x: hidden;}

.cld-main {width: 100%;max-width: 800px;}
.cld-main a{ color: #3f347d;}
  .cld-datetime{ position: relative; width: 66%; min-width: 100px; max-width: 300px; margin: auto; overflow: hidden; }
  .cld-datetime .today{ position: relative; float: left; width: calc(100% - 40px); margin: auto;text-align: center; }
  .cld-nav{ position: relative; width: 20px; height: 20px; margin-top: 2px; }
  .cld-nav:hover{cursor: pointer; }
  .cld-nav:hover svg{fill: #666;}
  .cld-rwd{float: left; }
  .cld-fwd{ float: right;  }
.cld-labels, .cld-days{ padding-left: 0;}
  .cld-label, .cld-day{ box-sizing: border-box;display: inline-block; width: 14.28%;text-align: center;  }
  .cld-day{ display: block; float: left; position: relative; margin: 0; padding: 5px; height: 106px;
     border: 1px solid #7780a7; overflow-y: auto; }
  .cld-day.clickable:hover{ cursor: pointer; }
  .cld-day.today{ border: 1px solid #9dff00;}
  .cld-day.disableDay{ opacity: 0.5; }
  .cld-day.nextMonth, .cld-day.prevMonth{ opacity: 0.33; }
    .cld-number{ margin: 0;text-align: left;    }
      .cld-title{font-size: 10px;display: block;margin: 0;font-weight: normal; }
      .cld-day:hover{background: #ac9378; }
      .cld-number.eventday{font-weight: bold;  }
      .cld-number.eventday:hover{ background: #a96f5b; }
      .today .cld-number.eventday:hover{ background: #b823ea; }

 @media (max-width: 600px) { 
        .cld-day{ height: 100px !important;}
        #calendar { margin-top: 2em; }
}