@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

body {
    background-color: #000000;
    background-image: linear-gradient(270deg, #000000 0%, #1f1e1e 74%);
    font-family: 'Roboto', sans-serif;
}

div.topSpacer {
    height: 50px;
}

.page-header {
    color: #949494;
}
.articleBody {
    background-color: #fff;
}

div.card {
    background-color: #444;
    width: 500px;
    margin: 50px auto;
    height: 150px;
    color: #fff;
    padding: 1.5rem;
}

#LoginBox {
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: #171717;
    padding: 10px 20px 10px 50px;
   color: #98a5a5;
    border-radius: 9px;
}

.masthead h2 {
    color: #707070;
}


.imgLinks {
  display: block;
  position: absolute;
  background: #40404070;
  padding: 5px;
  right: 8px;
  bottom: 8px;
  }

.imgLinks a {
    color: #FFF;  
    font-size: 1.2em;
    padding: 5px 10px;

  }
.imgLinks a:hover {
    background-color: #00b8ff;
  }
    
.imgLinks a.disabled {
      color: #5f5e5e;
      }
.imgLinks a.disabled:hover {
        background-color:transparent;
        cursor: default;
        }

 .btn-admin {
  background: repeating-linear-gradient(-55deg, #222, #222 10px, #333 10px, #333 20px);
  background-color: #252525;
            border-color: #bbbbbb;
            border-radius: 28px;
            color: white;
        }
  .btn-admin:hover {
    /* background-color:#3C3C3C; */ 
    color: white;
    -webkit-box-shadow: 1px 1px 9px -1px #000000; 
box-shadow: 1px 1px 9px -1px #000000;
  }      

/* DARK BACKGROUND VARIENETS */
h1.dk, h2.dk, h3.dk, h4.dk, h5.dk, h6.dk {
    color: rgb(209, 209, 209);
}


/* CALENDAR */

    .calMonth {
      font-family: 'Inter';
    }
    .calMonth .calDaysTH {
    display: flex;
    margin-top: 20px;
    }
    .calMonth .calDaysTH div {
    flex-grow: 1;
                  flex-basis: 0;
    background-color: #CCC;
    margin: 3px;
    text-align:center;
    }
    .calMonth .calDaysTH div:nth-child(1) {
    background-color: transparent;
    }
    .calMonth .calDaysTH div:nth-child(7) {
    background-color: #717171;
    }
    .calMonth .calDaysTH div:nth-child(8) {
    background-color: #717171;
    }

    .calMonth .calDays {
            display: flex;
    }

    .calMonth .calDays > a,.calMonth .calDays > div {
          flex-grow: 1;
          flex-basis: 0;
          position:relative;
          background-color: #2b2b2b;
          margin: 3px;
          text-align:center;
      }

    .calMonth .calDays > div {
    color: #FFF;
            border: 1px solid #1f1e1e;
    }
    .calMonth .calDays > div p {
    padding: 5px 2px;
    margin-bottom: 0;
    }

    .calMonth .calDay > div.calDayDate > a {
        color: #2b2b2b;
        padding-top: 5px;
        display: block;
    }
    .calMonth .calDay > div.calDayDate > a:hover {
      color: #5d6a6db8;
      cursor:pointer;
      }

    .calMonth .calDays .calDayDate { 
      position: absolute;
    bottom: 0;
    width: 100%;
    }
  
    .calMonth .calDays > div.calDay {
      color: #2b2b2b;
      border: 1px solid #565656;
      line-height: 22px;
      padding: 5px 2px 25px 2px;
      }

    .calMonth .calDays > div.calDay-available {
          border: 1px solid green;
      }
      .calMonth .calDays > div.calDay-available a:hover {
        color: green;
    }

    .calMonth .calDays .evt {
      font-size: 14px;
      border-radius: 2px;
      margin-bottom: 2px;
    }

    #calAddModal .calTS {
      flex-grow: 1;
      flex-basis: 0;
      border: 1px solid #009200;
      background-color: #fff;
      margin: 2px;
      font-size: .9em;
      color: #009200;
    }
    #calAddModal .calTS.inactive {
      border: 1px solid #c0c0c0;
      color: #c0c0c0;
    }
    #calAddModal .calTS.active {
      border: 1px solid #009200;
      background-color:#009200;
      color: #FFF;
    }
    #calAddModal .calTS:hover {
      background-color:#009200;
      color: #FFF;
    }

/* ASSET COLUMN */
.assetColumn {
    background-color: #d0d0d01f;
  }
  .assetColumn h1 {
    color: #d0d00b;
    font-size: 1.6rem;
  }
  .assetColumn p {
        color: whitesmoke;
  }
 .assetColumn .imageInner {
    padding: 7px;
    background-color: #000000b8;
    color: white;
    font-size: .8rem;
    text-align: center;
 }
 .assetColumn .descTable th {
   text-align:right;
   background-color: #4a4949a8;
   color: ghostwhite;
       font-size: small;
       border-bottom-color:#5d5d5d;
 }
 .assetColumn .descTable td {
   background-color: #4a49492e;
   color: ghostwhite;
       font-size: small;
              border-bottom-color:#5d5d5d;
 }
 .assetColumn .descTable i {
   font-size: initial;
 }

  .finColumn {
    max-width: 320px;
    background-color: #d0d0d01f;
    text-align:center;
    color: #FFF;

  }
   .assetColumn img {
    width: 100%;
  }