 body{        
    padding-top: 60px;
    padding-bottom: 40px;
}

div.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    padding: 50px;
    font-size: 36px;
    font-weight: bold;
}

.tableFixHead{
    overflow-y: auto; /* make the table scrollable if height is more than 200 px  */
    height: 200px; /* gives an initial height of 200px to the table */
}

.tableFixHead thead th {
    position: sticky; /* make the table heads sticky */
    top: 0px; /* table head will be placed from the top of the table and sticks to it */
}

table {
    border-collapse: collapse; /* make the table borders collapse to each other */
    width: 100%;
    margin-top: 25px;
}
th,tf,td {
    padding: 8px 16px;
    border: 1px solid #ccc;
}
th {
    background: #8a2323;
    color: white;
}
tf {
    background: #8a2323;
}

#mySongInput {
/* Song Title Search box */
    background-image: url("searchicon.png"); /* Add a search icon to input */ 
    background-position: 10px 12px; /* Position the search icon */
    background-repeat: no-repeat; /* Do not repeat the icon image */
    margin-left: 10px;
    width: 45%; /* Full-width */
    font-size: 16px; /* Increase font-size */
    padding: 12px 20px 12px 40px; /* Add some padding */
    border: 1px solid #ddd; /* Add a grey border */
    margin-bottom: 12px; /* Add some space below the input */
}

#header {
    background-color: #8a2323;;
    padding: 10px 10px;
    color: white;
    text-align: center;
    font-size: 24px; 
    font-weight: bold;
    position: fixed;
    top: 0;
    width: 100%;
    transition: 0.2s;
}
/* Help popup (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
}

/* Modal Content */
.modal-content {
    background-color: #8a2323;
    color: white;
    margin: auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
    border-radius: 25px;
}

/* The Close Button */
.close {
    color: white;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: green;
    text-decoration: none;
    cursor: pointer;
}
