Testosteroth/index_styles.css

* {
    padding: 0;
    margin: 0;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}

.menu_left_element {
    width: 110px;
    display: inline-block;
    margin-left: 15px
}

.menu_right_element {
    display: inline-block;
    width: 50px;
    height: 45px;
    margin-right: 25px;
}

.menu_element_text {
    border-radius: 10px;
    background-color: #8583FF;
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    padding: 0.4rem;
    font-size: 2.6rem;
    text-decoration-color: black;
}

#menu_left {
    position: absolute;
    left: 0;
    list-style-type: none;
    
}

#menu_right {
    position: absolute;
    right: 0;
    list-style-type: none;
}


#nav {
    background-color: #C4C4C4;
    height: 1.6cm;
    padding: 0.8rem;
    /* padding: 0.6rem; */
}


.grid-wrapper {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 80px 80px 80px;
    grid-gap: 10px;
}


.box {
    background-color: #C4C4C4;
    display: grid;
    grid-template-columns: 20px 50% auto;
    grid-gap: 5px;
    font-size: 1.4em;
    border-radius: 10px;
}

.entry {
    display: flex;
    vertical-align: center;
    align-items: center;
    padding: 5px;
}

.amount {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 10px;
}

.balance-list-wrapper {
    display: flex;
    justify-content: center;
}

.balance-list {
    display: grid;
    width: 700px;
    margin: 20px;
}

.overview {
    text-align: center;
    padding: 20px;
}

#title {
    font-size: 2em;
}

#total-amount {
    font-size: 3em;
    color: green;
}

.dropdown {
    background-image: url("./components/icons/caret-down-solid.svg");
    background-repeat: no-repeat;
    background-size: 15px;
    background-position: right;
    color: #f3f3f3;
}