.container {
    margin: 80px auto;
    background-color: #EBF5FF;
    width: 80%;
    max-width: 1200px;
    box-shadow: 3px 3px 3px 1px rgba(203,203,202,1);
    border-radius: 10px;
    padding: 15px;
}

.container table {
    width: 100%;
    border-collapse: collapse;
}

.container-content {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.items tbody {
    border-top: 2px solid black;
}

.items tbody tr {
    border-top: 1px solid black;
}

.items th {
    padding: 8px;
    text-align: left;
}

.items td.right,
.items th.right {
    text-align: right;
}

.items th.right {
    padding-right: 20px;
}

.items td {
    padding: 15px;
    text-align: left;
}

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

.searchbar-content label {
    position: relative;
}

.searchbar-content label:before {
    content: "";
    position: absolute;
    left: 2%;
    top: 0;
    bottom: 0;
    width: 10%;
    background: url('data:image/svg+xml,<%3Fxml version="1.0" %3F><svg enable-background="new 0 0 32 32" id="Editable-line" version="1.1" viewBox="0 0 32 32" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><circle cx="14" cy="14" fill="none" id="XMLID_42_" r="9" stroke="%23000000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2"/><line fill="none" id="XMLID_44_" stroke="%23000000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" x1="27" x2="20.366" y1="27" y2="20.366"/></svg>') center / contain no-repeat;
}

.searchbar-content input[type="text"] {
    padding-left: 12%;
}

.searchbar-content input {
    padding: 5px;
    background: none;
    border: 2px solid black;
    border-radius: 10px;
    box-sizing: border-box;
    width: 250px;
    color: black;
}

.searchbar-content input:focus {
    outline: none;
}

.searchbar-content input::placeholder {
    color: black;
}

.header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
}

.header h1 {
    font-size: 20px;
    margin: 0;
}

.header .actions {
    display: flex;
    align-items: center;
    margin-right: -10px;
}

.header .add-btn {
    margin-left: 10px;
}

.item-button #alert-button {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    min-width: 100px;
    height: 40px;
    border: 0;
    border-radius: 7px;
    color: white;
    background-color: #1B6AB2;
    margin: 20px 20px 40px 20px;
    padding: 5px;
}

.item-button #alert-button:hover {
    background-color: #1B6AD8;
}

.mail-button {
    background-color: #1B6AB2;
    border-radius: 5px;
    padding: 10px;
    margin-right: 15px;
}

.mail-button a {
    text-decoration: none;
    color: white;
}

/*test*/
.item-available a {
    color: green;
    font-weight: bold;
}

.item-unavailable a {
    color: red;
    font-weight: bold;
}