table
{
    thead
    {
        tr
        {
            .breadcrumb
            {
                margin-bottom: 0px;
                padding:6px 8px;
            }
            th
            {
                &.table-row-move
                {
                    width:70px;
                }
            }
        }
    }
}

table.last-button
{
    thead
    {
        tr:first-child
        {
            th
            {
                &:last-child
                {
                    width:76px;
                }
            }
        }
    }
    tbody
    {
        tr
        {
            td
            {
                &:last-child
                {
                    width: 76px;
                }
            }
        }
    }
}
table.first-checkbox
{
    thead
    {
        tr
        {
            th
            {
                &:first-child
                {
                    width:54px;
                    input[type=checkbox]
                    {
                        width:18px;
                        height:18px;
                        cursor: pointer;
                    }
                }
            }
        }
    }
    tbody
    {
        tr
        {
            td
            {
                &:first-child
                {
                    width:54px;
                    input[type=checkbox]
                    {
                        width:18px;
                        height:18px;
                        cursor: pointer;
                    }
                }
            }
        }
    }
}


.page-tabs-body
{
    display: none;
    &.active
    {
        display: block;
    }
}

@keyframes loaderrotate{
  from{
    transform:rotate(0deg);
  }
  to{
    transform:rotate(364deg);
  }
}
#loader-box
{
  position: fixed;
  top:0px;
  left:0px;
  width: 100%;
  height:100%;
  background-color: rgba(0,0,0,0.5);
  display: flex;
  z-index:99999;
  justify-content:center;
  align-items:center;
  i
  {
    font-size:2.5vw;
    color:#fff;
    animation-name:loaderrotate;
    animation-iteration-count:infinite;
    animation-duration:2s;
    animation-timing-function:linear;
  }
}


.calendar.table
{
  th,td
  {
    width: calc(100% / 7);

  }
}


//上傳圖片
.upload-photo-card
{
  display: flex;
  height:300px;
  background-color: #f1f1f1;
  justify-content:center;
  align-items:center;
  text-align: center;
  border-radius: 10px;
  cursor: pointer;
  position: relative;
  div > span
  {
    display: block;
  }
  &:hover
  {
    background:#ccc;
  }
  picture
  {
    display: block;
    
  }
  img
  {
    max-width:100%;
    max-height:100%;
    position: absolute;
    top:50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  input
  {
    display: none;
  }
  button
  {
    position: absolute;
    top:10px;
    right:10px;
    z-index:1;
  }
}


.modal
{
  .modal-tab
  {
    display: flex;
    padding:0 5px;
    border-top:1px solid #f1f1f1;
    border-bottom:1px solid #f1f1f1;
    margin:0 0 0 0;
    list-style: none;
    li
    {
      margin:0 5px;
      a
      {
        display: block;
        color:#333;
        padding:6px 8px;
        &.active
        {
          background-color: #007bff;
          color:#fff;
        }
      }
    }
  }
  .modal-upload-photo
  {
    width:100%;
    background-color: #ccc;
    border-radius: 10px;
    height:300px;
    display: flex;
    justify-content:center;
    align-items:center;
    text-align: center;
    cursor: pointer;
    position: relative;
    picture
    {
      position: absolute;
      top: 50%;
      left: 50%;
      max-width:100%;
      max-height:280px;
      transform: translate(-50%, -50%);
      img
      {
        display: block;
        max-width:100%;
        max-height:280px;
      }
    }
    div
    {
      span
      {
        display: block;
      }
    }
    input
    {
      display: none;
    }
  }
}

/**
 *
 * article
 *
 **/