/* Format the audio divs to be to the left/right of the centralised text */
.audio_right {
    width: 320px;
    float: right;
    margin-right: -45%;
    border-style: solid;
    border-width: 2px;
    border-radius: 5px;
    padding: 3px;
}

.audio_left {
    width: 320px;
    float: left;
    margin-left: -47%;
    border-style: solid;
    border-width: 2px;
    border-radius: 5px;
    padding: 3px;
}

audio {
    display: block;
    margin: auto;
}

/* When on small screens, make the text nearly full width
See: http://www.peachpit.com/articles/article.aspx?p=1681040&seqNum=3
*/
@media screen and (max-width: 500px) {
    .audio_right {
        width:100%;
        margin-right: -0%;
    }

    .audio_left {
        width:100%;
        margin-right: -0%;
    }
}