#videoContainer {
  float: right;
  text-align: center;
  width: 410px;
  border: 1px solid;
  border-radius: 3px;
  padding: 20px 0 0 0;
  margin: 10px; }

#videoContainerText {
  margin-top: 10px; }

#graphImg {
  border: 1px solid;
  width: 800px;
  border-radius: 3px;
  display: block;
  margin: 0 auto; }

#videoKey {
  padding-left: 0; }
  #videoKey li {
    padding: 2px; }
  #videoKey span.key {
    padding: 0  3px;
    border: 1px solid black; }
    #videoKey span.key.stick {
      background-color: #ff6881; }
    #videoKey span.key.hit {
      background-color: #43b7f9; }
    #videoKey span.key.double {
      background-color: #5aff84; }

#videoContainer .videoInner {
  width: 402px; }

/* phones */
@media screen and (max-width: 479px) {
  #videoContainer, #videoContainer .videoInner {
    width: 100%;
    border-width: 0; }
  #graphImg {
    width: 100%; } }