@import url('https://fonts.googleapis.com/css2?family=Saira+Condensed:wght@400;700&display=swap');

body{
    font-family: 'Saira Condensed', sans-serif;
    font-weight: 400;
}

.h100{
    height: 100vh;
}

.left-sidebar{
    background-color: dimgrey;
}

.c-white{
    color: #ffffff !important;
}

.mouse-pointer{
    cursor: pointer;
}

.floatingContainer{
    position: absolute; 
    top:10%; 
    left: 50%; 
    width: 50vw; 
    transform: translateX(-50%); 
    text-align: center;
}


/*** login form **/
.form-signin {
    width: 100%;
    max-width: 330px;
    padding: 15px;
    margin: auto;
}
.form-signin .checkbox {
    font-weight: 400;
}
.form-signin .form-control {
    position: relative;
    box-sizing: border-box;
    height: auto;
    padding: 10px;
    font-size: 16px;
}
.form-signin .form-control:focus {
    z-index: 2;
}
.form-signin input[type="email"] {
    margin-bottom: -1px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
    margin-bottom: 10px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
/*** end login form **/


.item-container .row:hover{
    background-color: #eee;
}

.card{
    background-color: rgb(247, 247, 247)
}

#fullLoader{
    position: fixed;
    width: 100vw;
    height: 100vh;
    transition: all 1s;
    background-color: rgba(255, 255, 255, .5);
    z-index: 1100;
    visibility: hidden;
}

    #fullLoader .loader-spinner{
        margin-top: 50vh;
        transform: translateY(-50%);
    }

    #fullLoader .loader-spinner .spinner-border{
        width: 5rem;
        height: 5rem;
    }

.error-field{
    border: 1px solid red;
    background-color: lightpink;
}

.green-container{
    margin-bottom: 10px; 
    background-color: #eee; 
    padding:10px;
}

.blue-container{
    margin-bottom: 10px; 
    background-color: #bddeef; 
    padding:10px;
}

.text-nowrap{
    white-space: nowrap;
}

.filtered-grid {  
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 0.5fr 1fr;
    grid-template-rows: 1fr;
    gap: 0px 5px;
    grid-auto-flow: row;
    grid-template-areas:
      "c1 c2 c3 c4 c5";
    margin-bottom: 5px;
  }
  
  .c1 { grid-area: c1; }
  
  .c2 { grid-area: c2; }
  
  .c3 { grid-area: c3; }
  
  .c4 { grid-area: c4; }
  
  .c5 { grid-area: c5; }

.filtered-grid > div{
    /* border: 1px solid red; */
}