* {
    margin: 0; padding: 0;
}



#play-button {
    width: 50px;
    height: 50px;
color:red;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: column;
}


#tempo {
    font-size: 40px;
color:navy;
}

.bpm {
    font-size: 14px;
    text-align: center;
color:black;
}

.tempo-controls {
    margin-top: 0px;
background-color: lightblue;
color:red;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: row;
}

.tempo-container {
    margin: 0 15px;
color:red;
}

button:focus {
    outline: none;
color:red;
}

.tempo-change{
    width: 50px;
    height: 30px;
}

.play {
    width: 0;
    height: 0;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
 //border-left: 40px solid #e9e9e9;
 border-left: 40px solid #00ff00;
    margin-left: 15px;
color:red;
}

.pause {
    width: 15px;
    height: 60px;
    border: none;
//border-left: 15px solid #e9e9e9;
border-left: 15px solid #ff0000;
//border-right: 15px solid #e9e9e9;
border-right: 15px solid #ff0000;
//color:red;
}