img {
  image-rendering: auto;
  image-rendering: crisp-edges;
  image-rendering: pixelated;
}
ul, ol, p {font-family: 'BioRhyme', serif; font-weight: 300;}
h2 {font-family: 'BioRhyme',serif; font-weight: 400;text-transform: uppercase;font-size: 1.5rem}
.title { padding-top: 95px; padding-bottom: 50px;}
.quote {font-family: 'BioRhyme', serif; font-weight: 300; font-size: 1.5rem;padding-bottom: 100px;}
.logo {padding-top: 110px;padding-bottom: 45px}
.menu { padding-bottom: 78px;}
.menu a { margin: 5px; padding: 5px 15px;color: #000;}
.contact{padding-bottom: 100px;background-image: url("../img/contact-notes.png");background-size: 1250px;background-repeat: no-repeat;background-position: top;}
#contact.title {padding-top: 10px;}
.contact h1 {color: #FFE006; text-transform: uppercase;}
.student-benefits{background-color: #fff1fd;; position: relative;}
.student-benefits h1 {color: #ffa4f5; text-transform: uppercase;}
.about{ position: relative;}
.about h1 {color: #ccff00; text-transform: uppercase;}
.policies{background-color: #E1F2FF; position: relative;}
.policies h1 {color: #b1dfff; text-transform: uppercase;}

.regular {font-weight: 400;}
/**
 *
 * Number List Circle
 *
 */

.list-circled-numbers {
  list-style: none;
  margin: 0;
  padding: 1em;
}

.list-circled-numbers li {
  counter-increment: mylistcounter;
  margin: 0;
  padding: .5em 1.5em 2em 3.5em;
}

.list-circled-numbers-second li:nth-child(1) {
	counter-reset: mylistcounter 3;
}
.list-circled-numbers li:before {
  content: counters(mylistcounter,"4");
  display: inline-block;
  border: 1px solid #000;
  border-radius: 50%;
  font-size: 1em;
  font-weight: bold;
  line-height: 1;
  width: 2em;
  height: 1em;
  padding: .5em 0;
  margin: -.5em 1.3em -3em -3.5em;
  text-align: center;
  vertical-align: top;
  box-sizing: initial;
}

.list-circled-numbers li > h1,
.list-circled-numbers li > h2,
.list-circled-numbers li > h3,
.list-circled-numbers li > h4,
.list-circled-numbers li > h5,
.list-circled-numbers li > h6,
.list-circled-numbers li > p {
  margin-top: 0;
  display: inline-block;
}

/**
 *
 * HR line
 *
 */

/* Gradient transparent - color - transparent */

hr.style14 { 
  border: 0; 
  width: 75%;
  float: left;
  margin-bottom: 40px;
  height: 2px; 
  background-image: -webkit-linear-gradient(left, #fff, #D8FF4B, #fff);
  background-image: -moz-linear-gradient(left, #fff, #D8FF4B, #fff);
  background-image: -ms-linear-gradient(left, #fff, #D8FF4B, #fff);
  background-image: -o-linear-gradient(left, #fff, #D8FF4B, #fff); 
}

/**
 *
 * Instruments
 *
 */

.keyboard{}
.guitar{}
.drums{}
.chelo{}

/* guitar */

/* Small only */
@media screen and (max-width: 39.9375em) {
	.logo {height: 190px;}
	.keyboard {position: absolute; top: -25px;left:35%;height: 50px;}
	.guitar {position: absolute;top: -50px;right:10%;height: 100px;}
	.victor-face {height: 125px;display: block; margin: 0 auto;}
	.references {margin: 50px 0px 0px 0px }
	.drums {position: absolute;top: 95%;left:35%;height: 70px;}
	hr.style14 {width: 100%; margin: 20px 0px 60px;}
	.chelo {position: absolute;top: -115px; left: 37%; height: 150px;}
}

/* Medium and up */
@media screen and (min-width: 40em) {
	.logo {height: 190px;}
	.keyboard {position: absolute; top: -50px;left:5%;height: 90px;}
	.guitar {position: absolute;top: -50px;right:10%;height: 175px;}
	.victor-face {height: 125px;float: right;}
	.drums {position: absolute;top: 75%;left:5%;height: 140px;}
	.chelo {position: absolute;top: -115px; right: 42%; height: 190px;}
}

/* Large and up */
@media screen and (min-width: 64em) {
	.keyboard {position: absolute; top: -50px;left:20%;height: 115px;}
	.guitar {position: absolute;top: -105px;right:200px;height: 225px;}
	.victor-face {height: 125px;float: right;}
	.drums {position: absolute;top: 75%;left:15%;height: 140px;}
	.chelo {position: absolute;top: -190px; right: 20%; height: 290px;}
}
