body {
    font-family: Arial, sans-serif; /* Changed default font */
    line-height: 1.6;
    background-color: #f4f4f4; /* Changed background color */
    color: #333; /* Changed text color */
}
#header {
    text-align: center; /* Centered my header div*/
}
#header h1, h4{
    margin: 0; /*Removed default margins to put the items together.*/
}

#accordion {
    width: 80%; /* Changed width */
    margin: 20px auto;/*  Centered the tabs */
    background-color: #fff; /* Changed background color of the accordioan */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Added box shadow */
}

#accordion .ui-accordion-header {
    text-transform: uppercase; /*made all the headings uppercase*/
}

#accordion .ui-state-active {
    background: rgb(145, 51, 204); /* Changed background color for active tab */
    border-bottom: 3px solid #000000; /* Added a white bottom border for active tab */
    font-weight: bold; /* Made font bold for active tab */
}

#accordion h2 {
    color: #333; /* Changed heading color */
    padding-bottom: 10px;/*added some bottom padding for space*/
    margin: 0px;/*removed defayult margins*/
}
#accordion h4 {
    color: rgb(145, 51, 204); /* Changed heading color */
    padding-bottom: 10px;/*added some bottom padding for space*/
    margin: 0px;/*removed default margins*/
}
#accordion p{
    margin-top: 0px; /*Removed default margins*/
}