html {
    font-family: Arial, Helvetica, sans-serif;
    color: black;
    background-color: white;

}

html,
body {
    margin: 0;
    padding: 0;
    -webkit-text-size-adjust: 100%;
}

body{
    flex-direction: column;    min-height: 100vh;

}

  .colored-text span:nth-child(odd) {
    color: black!important;
  }
  .colored-text span:nth-child(even) {
    color: red!important;
  }

main {
}

.company-logo {
    width: 150px;
}
h1,
h2 {
    color: #8BC53F;
}

h1 {
    font-size: 4rem;

}

body header {
    margin-bottom: 3rem;
}

.base-footer {
    color: white!important;
    width: 100%;
    margin-top: 5rem;
}


/* Dashboard */
.dashboard {
    margin: 2rem 0 2rem 0 ;
}

.dashboard_box {
    transition: 0.4s;
    width: 25%;
    cursor: pointer;
    padding: 1rem;
    border-radius: .5rem;
    border-left-width: .25rem!important;
    border-color: #8BC53F!important;
   
}
.column {
    float: left;
    width: 50%;
}

.dashboard a {
    text-decoration: none;
    color: black;
}

.dashboard_box div {
    text-align: center;
    padding: 1rem;
}

.dashboard_box:hover {
    transform: scale(1.05);
}

.navbar-toggler:focus {
    outline: none !important;
  }
  
.navbar a, .base-footer, .base-footer a {
    color: rgb(210, 210, 210);
}

.dashboard_box h3 {
    padding-top: 0;
    margin-top: 0;
    font-size: 3rem;
}

.dashboard_box p {
    padding-top: 1rem;
}


/* For the informations on a page*/
.informations div {
    margin: 1rem auto 1rem;
    padding: 1rem;
    border-radius: .7rem;
}

.informations div:nth-child(odd) {
    color: black;
    background-color: #f4f3f3;
    /* border-bottom: solid #8BC53F 1px; */
}


.informations div:nth-child(odd) h2, .informations div:nth-child(even) h2 {
    color: black;
}



.informations h2,
.informations h3 {
    margin-bottom: 0.5rem;
}

.item_company p {
    margin: 5px;
}

span {
    font-size: 0.8em;
}

section h2,
h3 {
    margin-bottom: -10px;
}

section.informations div a p {
    margin-bottom: 0;
}


input[type=file]::file-selector-button {
    border-radius: .25rem;
    border: none;
    padding: 5px 20px;
    margin-right: 20px;
    cursor: pointer;

}

.action_buttons {
    margin-top: 2rem;
}


/* filter form */

.filter {
    margin: 0 auto;
    display: flex;
    text-align: center;

}

/* Search form */

.search {
    text-align: center;
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin: 0 auto;
    display: flex;
}

.disabled:hover:after {
    position: absolute;
    top: 0;
    left: 75%;
    width: 100%;
    content: attr(title);
    background-color: #ffa;
    color: #000;
    line-height: 1.4em;
    border: 1px solid #000;
}



/* Table */
.not-checked-in a {
    color: #008000;
}

.checked-in a {
    color: #ff0000; 
}

.list_item {
    cursor: pointer;
}

tr:hover td {
    transition: .25s ease-out;
}


/* Nav Menu */
.navbar li {
    padding: 0 5px;
}

.container {
    max-width: 1400px;
}


.topnav a {
    color: rgba(255, 255, 255, .8);
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 1.25rem;
    font-weight: 400;
    margin-top: auto;
    margin-bottom: auto;
    display: inline-block;
    /* transition: .15s ease-out */
}

.dropdown-menu a:hover {
    background-color: transparent!important;
}

.active-profile-icon-div, .profile-icon-div{
    width: 3rem;

}

.profile-icon-div {
    border: 2px white solid!important;

}

.active-profile-icon-div {
    border: 2px #8BC53F solid!important;
}

.profile-icon {
    
    font-size: 1.5rem;
}

.topnav a:hover {
    color: rgba(255, 255, 255, 1);
    transform: scale(1.05);
}

.active_image  {
border: 2px #8BC53F solid!important;
}

.profile_img img:hover {
    border: 2px #8BC53F solid;
}

/* To remove border if the image is not loaded yet (design fix)  */
.loading {
    border: none!important;
}

/* Active in Navbar*/
.active {
    color: #8BC53F!important;
}

.logo img{
}
/* Pie Chart */



/* Form */
form textarea {
    resize: none;
}

.pool_account {
    background-color: rgba(139, 197, 63, .4);

}
.pool_account:hover {
    transition: 0.2s;
    background-color: rgba(117, 165, 53, 0.4)!important;
}

/* profile icon in header */
.topnav .profile_img img, 
.profile_image_container {
    border-radius: 1000px;
}
    .topnav a img {
    height: 2.5rem; 
}

    .topnav .profile a img {
        width: 2.5rem;
    }


/* item image on detail page */
.detail_img {
    max-height: 10em;
    margin-bottom: 2rem;
}

/* item image on overview page */
.list_img {
    height: 2rem;
}

/* yellow label */
.label {
    min-width: 10%;
    border-radius: .7rem;
    position: relative;

}

.bg-yellow {
    background-color: rgb(245, 218, 46);
}



.label h2 {
    color: black!important;
}

/* .navbar {
    display: none;
} */

@media only screen and (max-width: 990px) {

    .pie {
        display: inline-block;
        width: 20rem;
        margin-top: 1rem;
    }

    .profile_img{
        padding: 10px 0!important;
        
    }

    /* Table */
    .not-responsive-row {
        display: none;
    }

}

/* Responsive Design */
@media only screen and (max-width: 931px) {


    /* Nav-Bar */
    /* .topnav {
        display: none;
    }

    .navbar {
        display: block;
    } */


}

@media only screen and (max-width: 861px) {


    .dashboard {
        display: block;
    }

    .statistics{
        display: block!important;
    }

    .card {
        width: 90%!important;
        margin: 2rem auto 0!important;
    }

    .dashboard_box {
        height: 11rem;
        width: 90%;
        border-radius: 3%;
        margin: 2rem auto 0!important;
    }

}

@media only screen and (max-width: 710px) {
    .not-phone-format-row {
        display: none;
    }

    .pie {
        width: 23rem;
    }

}

.btn {
    border-radius: 1.25rem!important;
}


.navbar-toggler:focus {
    outline: none;
}

.text-custom-green {
    color: #8BC53F!important;
}

.custom_green {
    background-color: #8BC53F!important;
}

.custom_green_text {
    color: #8BC53F!important;
}

.bg-custom_green,input[type=file]::file-selector-button  {
    background-color: #8BC53F!important;
}

.custom_green:hover {
    background-color: #588917!important;
    color: white!important;
}

.fa-trash {
    color: red;
}


.filter_icon {
    transition: transform 0.35s ease;
    transform: rotate(0);
}

.rotate.filter_icon {
    transform: rotate(-90deg);
}