/* Colours
Text: #222;
Nav hover grey: #111;
Light bright green: #00d9ad;
Bright green: #00b893;
Light green: #aecdc7;
Mid grey: #7b8f8a;
Dark grey: #506266;
Light blue: #0d5580;
Dark blue: #0b486b;
Darker blue: #093a57;
Invalid yellow: #f5dd9d;

New Green: #04bf3c;
New light grey: #ccc;
Other greys: #666, #333, #222;

Browserfail Green: #99b3ad;
*/

/* A font by Jos Buivenga (exljbris) -> www.exljbris.com */

@font-face {
	font-family: Museo;
	src: url('scripts/Museo700-Regular.otf');
}

@font-face {
	font-family: Museo500;
	src: url('scripts/Museo500-Regular.otf');
}

body {
	margin: 0;
	padding: 0;
	background: url(images/sketchbackground.gif) #fff;
	font-family: "Segoe UI", Geneva, "Trebuchet MS", Arial, sans-serif;
	font-size: 100%;
	line-height: 1.5em;
	color: #222;
}

#container {
	margin: 4em 0;
	padding: 0 0 4em;
	/*background: url(images/curtains.png) no-repeat top left #fff;*/
	background-color: transparent;
	border: none;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #222;
}

#swoosh {
	margin: 0;
	padding: 0;
	background: url(images/stave.png) no-repeat top left transparent;
}

#news #swoosh {
	background-image: url(images/pedalstars.png);
}

#music #swoosh {
	background-image: url(images/sharps.png);
}

#biog #swoosh {
	background-image: url(images/segnos.png);
}

#contact #swoosh {
	background-image: url(images/mordents.png);
}

/* Headings */

h1 {
	margin: 0;
	padding: 0;
	height: 266px;
	background: url(images/masthead.png) no-repeat top left transparent;
	font-size: 0px;
	line-height: 0px;
	color: #fff;
}

#news h1, #music h1, #biog h1, #contact h1 {
	height: 192px;
	background: url(images/masthead_small.png) no-repeat top left transparent;
}

h2 {
	margin: 3.33em 0 0 10.67em;
	padding: 0;
	font-family: Museo, "Segoe UI", Arial, sans-serif;
	font-size: 1.5em;
	line-height: 1.33;
	font-weight: normal;
}

h3 {
	margin: 1.5em 0 0 13.33em;
	padding: 0;
	max-width: 30.83em;
	font-family: Museo, "Segoe UI", Arial, sans-serif;
	font-size: 1.2em;
	line-height: 1.25em;
	font-weight: normal;
	border: none;
	border-bottom: 1px solid #7b8f8a;
}

h3.time {
	margin: 0 0 0 16em;
	font-family: "Segoe UI", Geneva, "Trebuchet MS", Arial, sans-serif;
	font-size: 1em;
	line-height: 1.5em;
	font-style: italic;
	font-weight: normal;
	border: none;
}

/* Lists plus Navigation */

ul {
	margin: 1.5em 0 0 16em;
	padding: 0;
	width: 37em;
	list-style: none;
}

ul ul {
	margin: 0.5em 1.5em;
	list-style-type: circle;
}

li {
	margin-top: 0.5em;
}

ul li h3 {
	margin: 2em 0 0 0;
}

ul li span {
	font-weight: bold;
}

.nav {
	margin: 0 0 0 16em;
	width: 50.25em;
}

.nav li {
	margin: 0;
	padding: 0.25em 0;
	display: inline-block;
	background-color: #ccc;
	color: #fff;
	border-radius: 0.25em; /*css 3 */
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	-moz-border-radius: 0.25em;
	-moz-border-radius-topright: 0;
	-moz-border-radius-topleft: 0;
	-webkit-border-radius: 0.25em;
	-webkit-border-top-left-radius: 0;
	-webkit-border-top-right-radius: 0;
	text-shadow: 0 0 0.125em #999;
}

.nav li:hover {
	background: #333;
	background: -moz-linear-gradient(top, #666, #333);
	background: -webkit-gradient(linear,left top,left bottom,color-stop(0, #666),color-stop(1, #333));
}

#index .nav .home:hover, #news .nav .news:hover, #music .nav .music:hover, #biog .nav .biog:hover, #contact .nav .contact:hover {
	background: #ccc;
}

.nav li span {
	font-weight: normal;
}

.social li {
	font-weight: bold;
	display: block;
}

.social li a {
	padding-left: 1.5em;
	background: url(images/sprite.png) no-repeat top left transparent;
}

.social li a.da {
	background-position: 0 -608px;
}

.social li a.in {
	background-position: 0 -648px;
}

.social li a.tube {
	background-position: 0 -688px;
}

/* Content */

p {
	margin: 1.5em 0 0 16em;
	padding: 0;
	max-width: 37em;
	clear: none;
}

.intro {
	margin: 3.33em 0 0 10.67em;
	max-width: 24.67em;
	font-size: 1.5em;
	line-height: 1.33em;
}

strong {
	text-shadow: 0 0 0.125em #fff;
}

blockquote {
	margin: 0 0 0 1.5em;
	font-style: italic;
}

hr {
	visibility: hidden;
}

.hr {
	margin: 3em 0 3em 16em;
	padding: 0;
	width: 37em;
	height: 1px;
	background-color: #222;
}

.video {
	margin: 1.5em 0 0 16em;
	height: 18em;
}

dl {
	margin: 1.5em 0 0;
}

dd {
	margin: 0;
	font-size: 0.75em;
	font-style: italic;
}

/* Links */

a:link, a:visited, a:hover, a:active {
	font-weight: bold;
	color: #0b486b;
	text-shadow: 0 0 0.125em #fff; /* CSS 3 */
}

a:hover {
	color: #000;
	text-shadow: 0 0 0.125 #00b893;
}

.nav li a:link, .nav li a:visited, .nav li a:hover, .nav li a:active, #index .nav .home span, #news .nav .news span, #music .nav .music span, #biog .nav .biog span, #contact .nav .contact span {
	margin: 0;
	padding: 4px 0.5em 4px 1.25em;
	background: url(images/sprite.png) no-repeat top left transparent;
	font-family: "Museo 500", "Segoe UI", Arial, sans-serif;
	font-size: 1.2em;
	font-weight: normal;
	line-height: 1.25em;
	color: #fff;
	text-decoration: none;
	text-shadow: 0 0 0.25em #222; /* CSS 3 */
}

.nav li a:hover {
	color: #00d9ad;
}

.nav li a:active {
	color: #111;
}

.nav .home a:link, .nav .home a:visited, #index .nav .home span {
	background-position: 0 -5px;
}

.nav .home a:hover {
	background-position: 0 -45px;
}

.nav .home a:active {
	background-position: 0 -85px;
}

.nav .news a:link, .nav .news a:visited, #news .nav .news span {
	background-position: 0 -125px;
}

.nav .news a:hover {
	background-position: 0 -165px;
}

.nav .news a:active {
	background-position: 0 -205px;
}

.nav .music a:link, .nav .music a:visited, #music .nav .music span {
	background-position: 0 -245px;
}

.nav .music a:hover {
	background-position: 0 -285px;
}

.nav .music a:active {
	background-position: 0 -325px;
}

.nav .biog a:link, .nav .biog a:visited, #biog .nav .biog span {
	background-position: 0 -365px;
}

.nav .biog a:hover {
	background-position: 0 -405px;
}

.nav .biog a:active {
	background-position: 0 -445px;
}

.nav .contact a:link, .nav .contact a:visited, #contact .nav .contact span {
	background-position: 0 -485px;
}

.nav .contact a:hover {
	background-position: 0 -525px;
}

.nav .contact a:active {
	background-position: 0 -565px;
}

.nextvid span {
	font-family: helvetica, arial, sans-serif;
}

/* Images */

img {
	margin: 0.5em 1em 4em 16em;
	padding: 0;
	border: none;
}

.mugshot, .biogmugshot {
	float: left;
	border: 1px solid #fff;
}

.biogmugshot {
	margin: 1.825em 1em 1em 16em;
}

dl img {
	margin: 0;
	padding: 0;
	border: 1px solid #fff;
}

/* Form */

form, .jp-playlist-player {
	margin: 2em 0 0 16em;
	padding: 1.5em;
	width: 37em;
	color: #fff;
	background: #0b486b;
	background: -moz-linear-gradient(top, #0d5580, #0b486b); /* CSS 3 */
	background: -webkit-gradient(linear,left top,left bottom,color-stop(0, #0d5580),color-stop(1, #0b486b));
	border-radius: 0.25em;
	-moz-border-radius: 0.25em;
	-webkit-border-radius: 0.25em;
	box-shadow: 0 -0.0625em 0.125em #222;
	-moz-box-shadow: 0 -0.0625em 0.125em #222;
	-webkit-box-shadow: 0 -0.0625em 0.125em #222;
}

fieldset {
	margin: 0;
	border: none;
}

legend {
	margin: 0;
	padding: 0;
	font-weight: bold;
}

label {
	margin: 0;
	padding: 0;
	width: 8em;
	height: 2em;
	display: inline-block;
	font-weight: bold;
}

input, textarea {
	margin: 0;
	padding: 0 0 0 0.25em;
	height: 2em;
	font-family: "segoe UI", Geneva, "Trebuchet MS", Arial, sans-serif;
	font-size: 1em;
	background: #fff;
	border: 2px solid #093a57;
	border-radius: 0.25em; /* CSS 3 */
	-moz-border-radius: 0.25em;
	-webkit-border-radius: 0.25em;
	box-shadow: inset 0 -0.0625em 0.75em #222;
	-moz-box-shadow: inset 0 -0.0625em 0.75em #222;
	-webkit-box-shadow: inset 0 -0.0625em 0.75em #222;
}

input:hover, textarea:hover {
	box-shadow: inset 0 -0.0625em 0.75em #00b893; /* CSS3 */
	-moz-box-shadow: inset 0 -0.0625em 0.75em #00b893;
	-webkit-box-shadow: inset 0 -0.0625em 0.75em #00b893;
}

input:focus, textarea:focus {
	border: 2px solid #00b893;
}

textarea {
	height: auto;
}

table {
	border-collapse: collapse;
}

table label {
	vertical-align: top;
}

.invalid {
	width: auto;
	font-style: italic;
	color: #f5dd9d;
}

label.submit {
	margin-top: 1.5em;
}

#submit, .jp-controls a {
	margin-top: 1.5em;
	padding: 0;
	padding-left: 0.5em;
	padding-right: 0.5em;
	height: 3em;
	font-weight: bold;
	color: #fff;
	background: #0b486b;
	background: -moz-linear-gradient(top, #0d5580, #0b486b); /* CSS 3 */
	background: -webkit-gradient(linear,left top,left bottom,color-stop(0, #0d5580),color-stop(1, #0b486b));
	box-shadow: 0 -0.0625em 0.125em #222;
	-moz-box-shadow: 0 -0.0625em 0.125em #222;
	-webkit-box-shadow: 0 -0.0625em 0.125em #222;
}

#submit:hover, .jp-controls a:hover {
	color: #222;
	background: #00b893;
	border-color: #00b893;
	background: -moz-linear-gradient(top, #00d9ad, #00b893); /* CSS 3 */
	background: -webkit-gradient(linear,left top,left bottom,color-stop(0, #00d9ad),color-stop(1, #00b893));
}

#submit:active, .jp-controls a:active {
	color: #111;
	background: #093a57;
	box-shadow: inset 0 -0.0625em 0.75em #111;
	-moz-box-shadow: inset 0 -0.0625em 0.75em #111;
	-webkit-box-shadow: inset 0 -0.0625em 0.75em #111;
}

/* jPlayer */

.jp-playlist-player {
	margin: 0;
	padding: 0;
	position: fixed;
	overflow: hidden;
	bottom: 0;
	width: 14.5em;
	color: #fff;
}

.jp-interface {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

.jp-controls {
	margin: 0;
	padding:0;
}

.jp-controls li {
	display: inline-block;
	font-size: 0.75em;
	vertical-align: top;
}

.jp-controls a {
	margin: 0 0 0 0.25em;
	height: 2em;
	display: block;
	text-decoration: none;
	border: 2px solid #093a57;
	border-radius: 0.25em; /* CSS 3 */
	-moz-border-radius: 0.25em;
	-webkit-border-radius: 0.25em;
	text-shadow: none;
	-moz-text-shadow: none;
	-webkit-text-shadow: none;
}

.jp-controls .showhide {
	position: absolute;
	top: 0.25em;
	right: 0.25em;
	width: 0.375em;
	height: 1em;
	line-height: 0.75em;
	text-align: center;
	text-indent: -0.0625em;
	background: #222;
}

.jp-play, .jp-pause {
}

.jp-play {
}

.jp-play:hover {
}

.jp-pause {
}

.jp-pause:hover {
}

.jp-stop {
}

.jp-stop:hover {
}

.jp-previous {
}

.jp-previous:hover {
}

.jp-next {
}

.jp-next:hover {
}

.jp-progress-container {
	margin-top: 0.25em;
}

/* Progress bar */
.jp-progress {
	margin: 0.25em;
	padding: 0;
	overflow:hidden;
	background-color: #093a57;
	width: 8em;
	height: 1em;
	border: 2px solid #093a57;
	border-radius: 0.25em; /* CSS 3 */
	-moz-border-radius: 0.25em;
	-webkit-border-radius: 0.25em;
}

.jp-load-bar {
	background: #222;
	width: 0px;
	height: 1em;
	cursor: pointer;
}

.jp-play-bar {
	background: #00d9ad;
	width: 0px;
	height: 1em;
}

.jp-volume-min {
}

.jp-volume-min {
}

.jp-volume-min:hover {
}

.jp-volume-max {
}

.jp-volume-max:hover {
}

.jp-volume-container span, .jp-progress-container span {
	margin: 0;
	margin-left: 0.6em;
	font-size: 0.625em;
	line-height: 1em;
	display: block;
	height: 1em;
}

/* Volume bar */
.jp-volume-bar {
	margin: 0.25em;
	padding: 0;
	overflow: hidden;
	background: #093a57;
	width: 3em;
	height: 0.5em;
	cursor: pointer;
	border: 2px solid #093a57;
	border-radius: 0.25em; /* CSS 3 */
	-moz-border-radius: 0.25em;
	-webkit-border-radius: 0.25em;
}

.jp-volume-bar-value {
	background: #00d9ad;
	width: 0px;
	height: 0.5em;
}

.jp-playlist {
}

.jp-playlist ul{
	margin:0;
	padding:0;
	width: 14.5em;
	font-size: 0.75em;
}

.jp-playlist li {
	margin-left: 1.5em;
}

.jplayer_playlist_item_last {
}

.jplayer_playlist_current {
	list-style-type:square;
	list-style-position: outside;
}

.jp-playlist a {
	color: #fff;
	text-decoration: none;
	text-shadow: none; /* CSS 3 */
	-moz-text-shadow: none;
	-webkit-text-shadow: none;
}

.jp-playlist a:hover {
	color: #00d9ad;
	text-shadow: none; /* CSS 3 */
	-moz-text-shadow: none;
	-webkit-text-shadow: none;
}

/* Small Window */

@media only screen and (max-width: 480px), only screen and (max-device-width: 480px) {

#container {
	margin: 0;
}

#news #swoosh, #music #swoosh, #biog #swoosh, #contact #swoosh {
	background-image: none;
}

h1, #news h1, #music h1, #biog h1, #contact h1 {
	background: url(images/masthead_small_phone.png) no-repeat top left transparent;
}

h2 {
	margin: 3.33em 0 0 0.33em;
}

h3 {
	margin: 1.5em 0 0 0.417em;
}

h3.time {
	margin: 0 0 0 16em;
	font-family: "Segoe UI", Geneva, "Trebuchet MS", Arial, sans-serif;
	font-size: 1em;
	line-height: 1.5em;
	font-style: italic;
	font-weight: normal;
	border: none;
}

ul {
	margin: 1.5em 0 0 0.5em;
	width: 100%;
}

.nav {
	margin: 0.5em;
	width: 100%;
}

.nav li {
	display: inline;
	line-height: 3em;
}

p, .intro {
	margin: 1.5em 0 0 0.5em;
}

.hr {
	margin: 3em 0 3em 0.5em;
	width: 100%;
}

.video {
	margin: 1.5em 0 0 0.5em;
	height: 18em;
}

img {
	margin: 0.5em 1em 0.5em 0.5em;
}

.biogmugshot {
	margin: 1.825em 1em 1em 0.5em;
}

form {
	margin: 2em 0 0 0.5em;
	width: auto;
}

.jp-playlist-player {
	margin: 1.5em 0.5em;
	padding: 0;
	position: relative;
	overflow: hidden;
	width: 50%;
	color: #fff;
}

}