@media screen and (min-width: 1001px) {
    .pushpin {
      /* background-color: red; */
    }
  }
  
  @media screen and (min-width: 601px) and (max-width: 1000px) {
    .pushpin {
        width: 8%;
        height: auto;
      /* background-color: blue; */
    }
  }


  @media screen and (max-width: 600px) {
    .pushpin {
        width: 6%;
        height: auto;
      /* background-color: green; */
    }
  }

  /* (min-width: 401px) and (max-width: 600px) */

@media screen and (min-width: 1501px) {
  #demo {
    position:relative;
    left: 613px;
  }
}

@media screen and (max-width: 1500px) {
  #demo {
    text-align: center;
  }
}

@media screen and (min-width: 1501px) {
  #demo2 {
    position:relative;
    left: 613px;
  }
}

@media screen and (max-width: 1500px) {
  #demo2 {
    text-align: center;
  }
}

.pushpinInDailyList {
  position: relative;
  width: 6%;
}


.pushpinText {
    font-size: large;
    position: absolute;
    background-color: transparent;
    color: rgb(190,0,75);
    /* color: rgb(99, 71, 3); */
    font-weight: bold;
    text-decoration: none;
}



.chapterDailyListMember {
    font-size: large;
    position: relative;
    background-color: transparent;
    color: rgb(190,0,75);
    /* color: rgb(99, 71, 3); */
    font-weight: bold;
    text-decoration: none;
}


/* 小螢幕 (手機) 的字體調整 */
@media screen and (max-width: 600px) {
  .chapterDailyListMember {
      font-size: 8px;
  }
  #br1 {
    display: none;
  }
  .appear-time-cell {
    font-size: 8px; /* 小螢幕時 chronicle的左邊直排時間的字體大小 */
  }
  #demo, #demo2 {
    font-size: 18px; 
  }
}

/* 中等螢幕 (平板) 的字體調整 */
@media screen and (min-width: 601px) and (max-width: 1000px) {
  .chapterDailyListMember {
      font-size: 12px;
  }
  #br1 {
    display: none;
  }
  .appear-time-cell {
    font-size: 12px; /* 小螢幕時 chronicle的左邊直排時間的字體大小 */
  }
  #demo, #demo2 {
    font-size: 26px; 
  }
}