/* COLORS */

:root {
   
    --lighter: #515b744b;
    --light-black: #515b74;
    --black: #2e2d37;
    --white: #ffffff;
    --green: #00743F;
  }


/* COMPONENTS */

.primary-btn {
 
    padding: 14px;
    border-color: #00743f00 !important;
    color: var(--white);
    font-weight: 400;
    background-color: var(--green);
    float: left;
    margin-right: 16px;
    border-radius: 4px;
    padding-left: 20px;
    padding-right: 20px;
    font-size: 16px;
}

.secondary-btn {
    padding: 14px;
    border-color: var(--green)!important;
    color: var(--green);
    font-weight: 600;
    background-color: var(--white);
    float: left;
    margin-right: 16px;
    border-radius: 4px;
    font-size: 16px;
    padding-left: 20px;
    padding-right: 20px;
}

.tertiary-btn {
  border: none;
  color: var(--green);
  background-color: transparent;
  font-size: 16px;
  padding-left: 0px;
}

.input {
    padding: 16px;
    margin-bottom: 16px;
    color: var(--light-black);   
    width: 100%;
    border: 1px solid var(--lighter);
    border-radius: 4px;
}

.input:focus {
    border-color: transparent;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgb(40 40 40 / 39%);

}

.pagination {
    float: right;
}

.pagination>li>a, .pagination>li>span {
    color: var(--green);
}

.pagination > li > a.active-page{
    background-color: var(--green);
    color: var(--white);
}

::-webkit-scrollbar {
    width: 10px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
    background: #f1f1f1; 
  }
   
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: var(--lighter);
    border-radius: 8px;
  }

  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: var(--lighter);
    border-radius: 8px;
  }