/***********************************************************************************
 * LAYOUT
 ***********************************************************************************/
.l-container {
	width: 43.750rem;        /* 700px */
}
@media screen and ( max-width: 55.000rem ), ( max-device-width: 880px ) {
	.l-container {
		width: auto;
	}
}
/***********************************************************************************
 * HEADINGS
 ***********************************************************************************/
.h-app-title {
	font-size: 1.500em;
}
.h-artist {
	font-size: 1.250em;
}
/***********************************************************************************
 * ARTIST
 ***********************************************************************************/
.artist__name {
	margin-bottom: .500em;
	font-weight: bold;
	font-size: 1.750em;
}
/***********************************************************************************
 * LYRIC QUIZ
 ***********************************************************************************/
.lq-title {
	margin-bottom: .500em;
	font-weight: bold;
	font-size: 1.200em;
}
.lq-change-method {
  display: none;
}
.lt-ie9 .lq-change-method {
  display: inline;
}
.lq-result {
	font-weight: bold;
}
.lq-result--correct {
	color: #009900;
}
.lq-result--incorrect {
	color: #FF0000;
}
.lq-tally__fld {
	margin-right: .625em;
}
/***********************************************************************************
 * LYRIC QUIZ SCORES
 ***********************************************************************************/
.lq-scores {
  border-collapse: separate;
  border-spacing: .313em;
  border: .063rem solid #000;
  margin: .313em 0em;
}
.lq-scores .score {
  width: 15%;
  text-align: right;
}
.lq-scores .player {
  width: 28%;
  text-align: left;
}
.lq-scores .datetime {
  width: 27%;
}
.lt-ie9 .lq-scores td { 
  padding: .125em; 
  border: .063rem solid #000; 
}
.lq-scores {
    background: #FFF;
}
.lq-scores tbody > tr:nth-child(odd) {
    background: #EEE;
}
@media screen and ( max-width: 31.250rem ), ( max-device-width: 500px ) {
	.lq-scores table, 
  .lq-scores tr,
  .lq-scores td {
    display: block;
	}
	.lq-scores th {
    display: none;
	}
  .lq-scores .score {
    width: auto;
    padding: .200rem;
    text-align: left;
  }
  .lq-scores .score:before {
    display: inline-block;
    width: 7.188rem;
    padding-right: .250rem;
    text-align: right;
    font-weight: bold;
  }
  .lq-scores .player:before {
    content: "Player: ";
  }
  .lq-scores .questions:before {
    content: "Questions: ";
  }
  .lq-scores .correct:before {
    content: "Total Correct: ";
  }
  .lq-scores .points:before {
    content: "Total Points: ";
  }
  .lq-scores .datetime:before {
    content: "Date/Time: ";
  }
}