#gridList {
  position: absolute;
  left: -3vw;
  padding-left: 2rem;
  margin: 0;

  flex-wrap: nowrap;

  transform: translateZ(0);
  width: 100vw;
  padding-right: 2rem;
}

#gridList::-webkit-scrollbar {
  width: 0px;
  background: transparent;
  /* make scrollbar transparent */
}

.img-disconnect {
  height: 350px;
}
.img-disconnect img {
  margin: 60px 0px 30px 0px;
}

#table_reserve {
  font-weight: 300;
}


.cardBoxFixed {
  margin-left: 15px;
  margin-right: 15px;
  min-width: 250px;
  max-width: 280px;
  box-shadow: "0 4px 6px rgba(0,0,0,0.14)";
  border-radius: "10px";
  display: "block";
  text-align: "center";
  background: "#fff";
  border-radius: 5px;
  --border-size: 5px;
  --border-angle: 0turn;
  background-image: conic-gradient(
      from var(--border-angle),
      #fff,
      #fff 50%,
      #fff
    ),
    conic-gradient(from var(--border-angle),#2ecc71 30%,blue,#2ecc71);
      background-size: calc(100% - (var(--border-size) * 2))
      calc(100% - (var(--border-size) * 2)),
    cover;
  background-position: center center;
  background-repeat: no-repeat;

  animation: AnimateBG 20s ease infinite;
  /* animation: bg-spin 3s linear infinite; */
}

  @keyframes AnimateBG { 
    0%{
    background-image: conic-gradient( from var(--border-angle),#fff,#fff 50%,#fff ),conic-gradient(from var(--border-angle),#2ecc71 50%,blue,#2ecc71)
    }
    50%{
    background-image: conic-gradient( from var(--border-angle),#fff,#fff 50%,#fff ),conic-gradient(from var(--border-angle),#2ecc71 80%,blue,#2ecc71)
      }
      
       100%{
    background-image: conic-gradient( from var(--border-angle),#fff,#fff 50%,#fff ),conic-gradient(from var(--border-angle),#2ecc71 100%,blue,#2ecc71)
      }
      }