html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}

body {
line-height: 1;
}

ol, ul {
list-style: none;
}

blockquote, q {
quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}

table {
border-collapse: collapse;
border-spacing: 0;
}

html,
body {
height: 100%;
}

body {
display: table;
width: 100%;
background: #FFF;
}

*,
*:after,
*:before {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
margin: 0;
}

.page-row {
display: table-row;
height: 1px;
}

.page-row-expanded { height: 100%; }

.clearfix:before, .clearfix:after { content: ""; display: block; }
.clearfix:after { clear: both; }
.ie6 .clearfix { zoom: 1 }

#preloader {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #FFF;
z-index: 10001;}

.spinner {
position: absolute;
left: 50%;
top: 50%;
width: 70px;
height: 70px;
margin: -35px 0 0 -35px;
text-align: center;}

.spinner > div {
width: 18px;
height: 18px;
border-radius: 100%;
display: inline-block;
-webkit-animation: bouncedelay 1.4s infinite ease-in-out;
animation: bouncedelay 1.4s infinite ease-in-out;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;}

.spinner .bounce_01 { background: #000; }
.spinner .bounce_02 { background: #000; }
.spinner .bounce_03 { background: #000; }

.spinner .bounce_01 {
-webkit-animation-delay: -0.32s;
animation-delay: -0.32s;}

.spinner .bounce_02 {
-webkit-animation-delay: -0.16s;
animation-delay: -0.16s;}

@-webkit-keyframes bouncedelay {
0%, 80%, 100% { -webkit-transform: scale(0.0) }
40% { -webkit-transform: scale(1.0) }}

@keyframes bouncedelay {
0%, 80%, 100% {
    transform: scale(0.0);
    -webkit-transform: scale(0.0);
} 40% {
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
}
}


/* TYPOGRAPHY
----------------------------------------------------------------------------------------*/

body {
-webkit-font-smoothing: antialiased;
color: #000;
}

h1, h2, h3, h4, h5, h6 {
font-family: 'Adobe Garamond Pro', 'adobe-garamond-pro';}

h1 {
text-align: center;
line-height: 1.618em;
margin: 0 auto;}

h2 {
text-align: center;
line-height: 1.618em;
margin: 0 auto;}

.title h1, .title h2 { margin: 0 auto; }

p, table {
font-family: 'Adobe Garamond Pro', 'adobe-garamond-pro';
font-weight: 300;
line-height: 1.618em;
margin: 0 auto;
max-width: 30em;
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
-ms-font-smoothing: antialiased;
-o-font-smoothing: antialiased;}

p + p { margin: 1em auto; }

p.center { text-align: center; }
.center { text-align: center; }

.smaller { font-size: 80%; }

p.sans {
font-family: 'futura-pt', 'Futura PT';
font-weight: 400;
font-size: 14px;
line-height: 2em;
letter-spacing: 2.5px;
text-transform: uppercase;
color: #848482;}

ul { list-style-type: disc; margin: 0 auto; }
ol { list-style-type: decimal; margin-left: 1.618em; }
nav ul, nav ol { list-style: none; margin: 0 auto; padding: 0;}

b, strong { font-weight: 600; }
i, em { font-style: italic; }
sl { font-size: 80%; }

::selection { background: #d43c4b; color: #fff; }
::-moz-selection { background: #d43c4b; color: #fff;}

a, a:visited {
font-weight: 400;
color: #000;
outline: none;
text-decoration: none;
border: none;
padding-bottom: 3px;
border-bottom: 1px solid #303030;
-webkit-transition: color 0.15s ease-in-out;
-moz-transition: color 0.15s ease-in-out;
-o-transition: color 0.15s ease-in-out;
transition: color 0.15s ease-in-out;}

a:hover { outline: none; text-decoration: none; color: #d43c4b; }
a:active, a:focus { outline: none; }

a.presskit {
font-family: 'futura-pt', 'Futura PT';
font-weight: 400;
font-size: 14px;
line-height: 2em;
letter-spacing: 2.5px;
text-transform: uppercase;
color: #848482;
text-decoration: none;
border: none;
cursor: pointer;
-webkit-transition: color 0.2s ease-in-out;
-moz-transition: color 0.2s ease-in-out;
-o-transition: color 0.2s ease-in-out;
transition: color 0.2s ease-in-out;}

a.presskit:hover {color: #000;}

svg#itunes {
width: 100%;
max-width: 150px;
display: block;
margin: 2.25em auto;}


/* SIZES
----------------------------------------------------------------------------------------*/
h1 { font-size: 2em; }

h1.big { font-size: 3.5em; margin: 0 auto; }

h2 { font-size: 1.75em; }

p, ul, ol, dl, blockquote { font-size: 1.25em; }


/* LAYOUT
----------------------------------------------------------------------------------------*/

.container {
max-width: 960px;
margin: 0 auto;}

section.parallax {
background-image: url(../../images/sheetmusic.jpg);
background-position: 50% 0;
background-size: cover;
background-attachment: fixed;}

.parallax_content {
margin: 0 auto;
padding: 2.5em;}

.parallax_content p, .parallax_content h1 {
color: #FFF;}

.parallax-window {
min-height: 400px;
background: transparent;}

#wrapper {
max-width: 100%;
margin: 0 auto;}

.column + .column { margin: 2.5em auto;}

header {
max-width: 100%;
position: relative;
margin: 1.25em auto;}

.content {
width: 100%;
max-width: 60em;
margin: 4em auto;
display: block;
padding: 0 7.5%;}

.content_large {
width: 100%;
max-width: 80em;
margin: 4em auto;
display: block;
padding: 0 7.5%;}

.block {
display: block;
margin: 4.5em auto;}

.header_work {
display: block;
margin: 3em auto;}

.header_title {
display: block;
margin: 3em auto;}

.quote {
display: block;
margin: 100px auto;
text-align: justify;}

.quote h2 { text-align: justify; }

p.author {
text-align: right;
max-width: 100%;}

img.logo {
width: 100%;
max-width: 100px;
height: auto;
margin: 1.25em auto;
display: block;}

.mobile_header {
width: 100%;
height: auto;
margin: 0 auto;
position: relative;
display: block;
background-image: url(../../images/sheetmusic.jpg);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;}

.vertical_center {
position: absolute;
top: 50%;
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width: 100%;
padding: 0 15px;
z-index: 1000;}


/* Essays
----------------------------------------------------------------------------------------*/
img.essay--box-thumbnail {
	grid-area: thumbnail;
	width: 200px;
	height: 200px;
	object-fit: cover;
}

.essay--box-information {
	grid-area: information;
}

.essay--box-information h1 {
	text-align: left;
}

.essay--box {
	display: grid;
	grid-template-areas: 'thumbnail information';
	grid-template-columns: 25% 75%;
	grid-column-gap: 50px;
	margin: 0 auto 2.5em;
}

@media screen and (max-width: 600px) {

	.essay--box {
		display: grid;
		grid-template-areas: 'thumbnail' 'information';
		grid-template-columns: auto;
		grid-template-rows: auto auto;
		grid-row-gap: 50px;
		margin: 0 auto 2.5em;
	}

}


/* Navigation
----------------------------------------------------------------------------------------*/
.navigation {
display: block;
width: 60%;
text-align: center;
background-color: #FFF;
margin: 1.25em auto;}

.navigation li {
display: inline-block;
padding: 0 2%;}

.navigation li a {
font-family: 'futura-pt', 'Futura PT';
font-weight: 400;
font-size: 14px;
line-height: 2em;
letter-spacing: 2.5px;
text-transform: uppercase;
color: #848482;
text-decoration: none;
border: none;
-webkit-transition: color 0.2s ease-in-out;
-moz-transition: color 0.2s ease-in-out;
-o-transition: color 0.2s ease-in-out;
transition: color 0.2s ease-in-out;}

.navigation li a:hover,
.navigation li.current a {color: #000;}


/* Footer
----------------------------------------------------------------------------------------*/
footer {
background-color: #FFF;
margin: 2.5em auto 0;}

#copyright p {
font-family: 'futura-pt', 'Futura PT';
color: #848482;
font-weight: 300;
font-size: 11px;}

.footer { padding: 1.25em 2.5%; }

img.richard {
width: 100%;
max-width: 400px;
margin: 2.5em auto;
display: block;}


/* Video
----------------------------------------------------------------------------------------*/
.video {
max-width: 50em;
margin: 2.5em auto;
display: block;}

.video_container {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
max-width: 100%;
margin: 1.5em auto;
height: auto;}

.video_container iframe, .video_container object, .video_container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;}


/* Audio
----------------------------------------------------------------------------------------*/
audio {
display: block;
margin: 1em auto;}

.audio {
display: block;
margin: 2.25em auto;}


/* Photography
----------------------------------------------------------------------------------------*/
img, embed, object, video { margin: 0 auto; max-width: 100%; height: auto; display: block; }
.ie6 img.full, .ie6 object.full, .ie6 embed, .ie6 video { width: 100%; }

#gallery {
max-width: 60em;
height: auto;
margin: 2.5em auto;
}

.wrapper_gallery { overflow: hidden; }

#gallery a img {
width: 49%;
float: left;
position: relative;
margin: 0 0 2% 0;
opacity: 1;
-webkit-backface-visibility: hidden;
-webkit-transition: opacity 0.2s ease-in-out;
-moz-transition: opacity 0.2s ease-in-out;
-o-transition: opacity 0.2s ease-in-out;
transition: opacity 0.2s ease-in-out;
}

#gallery a:nth-child(odd) img { margin: 0 2% 2% 0; }

#gallery a:hover img { opacity: 0.8; }

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

#gallery a img { width: 49%; margin: 0 0 2% 0; }

#gallery a:nth-child(odd) img { margin: 0 2% 2% 0; }
}

a.album-preview-link-block {
  text-decoration: none;
}

a.album-preview-link-block img {
  max-width: 400px;
  width: 100%;
  margin: 0 auto;
  display: block;
  opacity: 1;
  -webkit-backface-visibility: hidden;
  -webkit-transition: opacity 0.2s ease-in-out;
  -moz-transition: opacity 0.2s ease-in-out;
  -o-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
}

a.album-preview-link-block:hover img { opacity: 0.8; }