body {
	background-color:#FFF;
}


/**********HEADER**********/

/*.header-container {
	width: 100%;
	max-width: 1140px;
	min-width: 755px;
	margin: 0 auto;
	overflow: hidden;
} */

.header-container {
	position: fixed;
    top: 0;
    height: 80px;
    width: 100%;
	z-index: 30;
    background-color: #fff;	
	box-shadow: 0px 0px 30px  0px rgba(0, 0, 0, 0.5);
}

.header-text {
	margin-top: -10px;	
}

a.title-name {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 40px;
	color: #06F;
	text-decoration:none;
}

a.title-name:hover {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 40px;
	color: #5893FF;
	text-decoration:none;
}

p.subtitle-name {
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 40px;
	margin-top: -5px;
	color: #06F;
}

.homepage-header-spacer {
	padding-top:28px;
}

#headerlogo {
	background-image:url('/img/ryanlestermusic-logo.png');
	background-repeat: no-repeat;
	display:block;
	height:32px;
	width:323px;
	margin-top: 13px;
	text-indent:-9999px;
}

#headerlogo:hover {
	opacity:.75;
}

/**********HOVER EFFECTS**********/

.effects {
  padding-left: 0px;
}
.effects .img {
  position: relative;
  float: left;
  width: 100%;
  overflow: hidden;
  margin-bottom: 10px;
}
.effects .img:nth-child(n) {
  margin-right: 0px;
}
.effects .img:first-child {
  margin-left: 0px;
}
.effects .img:last-child {
  margin-right: 0px;
}
.effects .img img {
  display: block;
  margin: 0;
  padding: 0;
  max-width: 100%;
  height: auto;
}

.overlay {
  display: block;
  position: absolute;
  z-index: 10;
  background: rgba(0, 0, 0, 1);
  overflow: hidden;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}

a.close-overlay {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 20;
  height: 100%;
  font-size: 20px;
  color: #fff;
  line-height: 20px;
  text-align: center;
  background-color: #000;
  cursor: pointer;
}

a.close-overlay.hidden {
  display: none;
}

a.expand {
  display: block;
  position: absolute;
  text-decoration: none;
  z-index: 20;
  text-align: center;
  color: #fff;
  line-height: 40px;
  font-family: 'Open Sans', sans-serif;
  font-weight: 300;
  font-size: 30px;
}

#img-effect .overlay {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0;
}
#img-effect .overlay a.expand {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
#img-effect .img.hover .overlay {
  opacity: .75;
}
#img-effect .img.hover .overlay a.expand {
  width: 100%;
  height: 60px;
}

/**********BIO AND CONTACT STYLES**********/

.bio-background-img {
	width:100%;
	height:100%;
	background-image:url(/img/bio/ryanlestermusic-bio-conducting-3.jpg);
	background-size:cover;
	background-position:center; /* IE fix */
}

.contact-background-img {
	width:100%;
	height:100%;
	background-image:url(/img/bio/ryanlestermusic-water-sunset.jpg);
	background-size:cover;
	background-position:center; /* IE fix */
}

.bio-container {
	margin-top: 300px;
	background: rgb(0, 0, 0);
    background: rgba(0, 0, 0, .5);
	padding: 1px 20px 1px 20px;
}

.contact-container {
	margin-top: 300px;
	background: rgb(0, 0, 0);
    background: rgba(0, 0, 0, .5);
	padding: 1px 20px 10px 20px;
}

p.bio-contact-text {
	font-family: 'Open Sans', sans-serif;
	font-weight: 100;
	font-size: 18px;
	line-height: 25px;
	color: #fff;
}

.bio-contact-text a:link {
	color: #fff;
	text-decoration: underline;
}

.bio-contact-text a:visited {
	color: #fff;
	text-decoration: underline;
}

.bio-contact-text a:hover {
	color: #06F;
	text-decoration: underline;
}

.bio-contact-text a:focus {
	color: #fff;
}



p.bio-contact-headline {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 30px;
	margin-top: 15px;
	margin-bottom: 1px;
	color: #fff;
}

p.contact-headline {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 30px;
	margin-top: 15px;
	margin-bottom: 1px;
	color: #fff;
}

p.bio-contact-caption {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 15px;
	line-height: 21px;
	color: #fff;
}

#social-links {
	width: 100%;
    margin-top:0px;
    margin-left: auto; 
    margin-right: auto;
}

#social-links a {
    vertical-align: top;
    display: inline-block;
    *display: inline;
    zoom: 1;
}

.stretch {
    width: 100%;
    display: inline-block;
    font-size: 0;
    line-height: 0
}

/**********LISTEN**********/

.blue-one {
	background-color: #06F;
}

.blue-two {
	background-color: #1385FF;
}

.blue-three {
	background-color: #70AFFF;
}

.listen-panel {
	padding: 10px 20px 10px 20px;	
}

p.listen-section {
	color: #fff;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 20px;
}

p.listen-text {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 18px;
	line-height: 30px;
	color: #333;
}

h1.listen-title {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 50px;
	margin-left: -20px;
	color: #000;
}


h2.listen-section-title {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 40px;
	margin-top: 0px;
	color: #000;
}

.listen-panel:hover {
	opacity:.75;
}
	
.iframe-window {
	height: 100%;
	padding: 20px;
	background-color: #F9F9F9;	
}


/********* FORM **********/

input, textarea {
	width:100%;
	height:27px;
    background:#FFF;
    border:1px solid #dedede;
    padding:10px;
    margin-top:20px;
    font-size:0.9em;
    color:#3a3a3a;
}

input:focus, textarea:focus {
    border:1px solid #97d6eb;
}

textarea {
	height:213px;
	background: #FFF;
}

#submit {
    width:100%;
    height:38px;
    background: #06F;
    border:none;
    margin-top:20px;
    cursor:pointer;
	color: #fff;
}

#submit:hover {
	opacity:.9;
}

.concert-music-1 {
	background-image: url(/img/concert/concert-1.jpg);
	padding: 0px 0px 0px 0px;
	background-position:left top;
	background-repeat: no-repeat;
	
}

.concert-music-2 {
	background-image: url(/img/concert/concert-2.jpg);
	padding: 0px 0px 30px 30px;
	background-position:left top;
	background-repeat: no-repeat;
}

.concert-music-3 {
	background-image: url(/img/concert/concert-3.jpg);
	padding: 0px 0px 30px 30px;
	background-position:left top;
	background-repeat: no-repeat;
}

.concert-music-4 {
	background-image: url(/img/concert/concert-4.jpg);
	padding: 0px 0px 30px 30px;
	background-position:left top;
	background-repeat: no-repeat;
}

.concert-music-5 {
	background-image: url(/img/concert/concert-5.jpg);
	padding: 0px 0px 30px 30px;
	background-position:left top;
	background-repeat: no-repeat;
}

.concert-music-6 {
	background-image: url(/img/concert/concert-6.jpg);
	padding: 0px 0px 30px 30px;
	background-position:left top;
	background-repeat: no-repeat;
}

.concert-music {
	padding: 0px 0px 0px 0px;	
}

.concert-music-padding {
	margin-top: 80px;	
}


/**********PROJECT STYLES**********/

h1.headline {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 60px;
	color: #fff;
	padding: 10px 20px 20px 20px;
}

h1.headline-vr {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 40px;
	line-height:50px;
	color: #fff;
	padding: 10px 20px 20px 20px;
}

p.concert-audio-title {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 20px;
	line-height: 30px;
	color: #333;
	background: rgba(255, 255, 255, .9);
	filter: alpha(opacity=90);
	opacity: 0.9;
	margin-left: -20px;
	padding-left: 20px;
	padding-top: 5px;
	padding-bottom: 5px;
	margin-bottom: -10px;
	margin-top: 10px;
	margin-right: 10px;
}

.project-header-novi {
	background-image: url(../img/projects/novi/novi-header.jpg);
	height: 250px;
	margin-top: 80px;
	background-position:left;
}

.project-header-ted-nelms {
	background-image: url(../img/projects/ted-nelms/ted-nelms-header.jpg);
	height: 250px;
	margin-top: 80px;
	background-position:right;
}

.project-header-boxman {
	background-image: url(../img/projects/boxman/boxman-header.jpg);
	height: 250px;
	margin-top: 80px;
	background-position:right;
}

.project-header-infinite-library {
	background-image: url(../img/projects/infinite-library/infinite-library-header.jpg);
	height: 250px;
	margin-top: 80px;
	background-position:center;
}

.project-header-harley {
	background-image: url(../img/projects/harleyandthedavidsons/harley-header.jpg);
	height: 250px;
	margin-top: 80px;
	background-position:center;
}

.project-header-crossbones {
	background-image: url(../img/projects/crossbones/crossbones-header.jpg);
	height: 250px;
	margin-top: 80px;
	background-position:center;
}

.project-header-thedailyshow {
	background-image: url(../img/projects/thedailyshow/thedailyshow-header.jpg);
	height: 250px;
	margin-top: 80px;
	background-position:center;
}

.project-header-tinycommando {
	background-image: url(../img/projects/tinycommando/tinycommando-header.jpg);
	height: 250px;
	margin-top: 80px;
	background-position:center;
}

.project-header-barelylethal {
	background-image: url(../img/projects/barelylethal/barelylethal-header.jpg);
	height: 250px;
	margin-top: 80px;
	background-position:center;
}

.project-header-thebigg {
	background-image: url(../img/projects/thebigg/thebigg-header.jpg);
	height: 250px;
	margin-top: 80px;
	background-position:left;
}

.project-header-oberlinilluminate {
	background-image: url(../img/projects/oberlinilluminate/oberlinilluminate-header.jpg);
	height: 250px;
	margin-top: 80px;
	background-position:left;
}

.project-header-loveandvenom {
	background-image: url(../img/projects/loveandvenom/loveandvenom-header.jpg);
	height: 250px;
	margin-top: 80px;
}

.project-header-commercial {
	background-image: url(../img/projects/commercial/commercial-header.jpg);
	height: 250px;
	margin-top: 80px;
	background-position:right;
}

.project-header-vr-water {
	background-image: url(../img/projects/vr-water-instrument/vr-water-instrument-header.jpg);
	height: 250px;
	margin-top: 80px;
	background-position:center;
}

p.project-text {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 20px;
	line-height: 30px;
	color: #333;
}

p.project-text-commercial {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 20px;
	line-height: 30px;
	margin-bottom:-10px;
	color: #333;
}

p.project-text-subline {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 17px;
	line-height: 24px;
	color: #333;
}

p.audio-title {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 20px;
	line-height: 30px;
	color: #333;
	margin-bottom: 10px;
	margin-top: 25px;
}

p.commercial-title {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 20px;
	line-height: 30px;
	color: #333;
	margin-bottom: 10px;
	margin-top: 0px;	
}

.responsive-project {
	margin-top: 0px;	
}

figure {
	display: block; 
	margin: 0 0 0px 0;
}

.video-resize {
	width: 100%;
	padding-right: 10px;
	margin-bottom: 20px;
}

video {
	width: 100%    !important;
	height: auto   !important;
}

a.project-text {
	font-family: 'Open Sans', sans-serif;
	text-decoration: none;
	font-weight: 400;
	font-size: 20px;
	color: #999;
}

a.project-text:hover {
	font-family: 'Open Sans', sans-serif;
	text-decoration: none;
	font-weight: 400;
	font-size: 20px;
	color: #06F;
}

.sidebar-attribute {
	border-top: 1px solid #ccc;
	margin-top: 10px;
}

.sidebar-bottom {
	border-bottom: 1px solid #ccc;
}

h2.sidebar-headline {
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 18px;
	color: #999;
	margin-top: 10px;
}


h3.sidebar-subline {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 18px;
	color: #5893FF;
	margin-top: -15px;	
	margin-bottom: 10px;
}

p.sidebar-longtext {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 18px;
	color: #5893FF;
	margin-top: -15px;	
	margin-bottom: 10px;
}

p.sidebar-longtext {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 18px;
	color: #5893FF;
	margin-top: 0px;	
	margin-bottom: 10px;
}

a.sidebar-link {
	font-family: 'Open Sans', sans-serif;
	text-decoration: none;
	font-weight: 400;
	font-size: 18px;
	color: #5893FF;
	margin-top: -15px;	
	margin-bottom: 10px;
}

a.sidebar-link:hover {
	font-family: 'Open Sans', sans-serif;
	text-decoration: none;
	font-weight: 400;
	font-size: 18px;
	color: #06F;
	margin-top: -15px;	
	margin-bottom: 10px;
}

/**********Audio Player**********/

.audio-wrapper {
	padding-right: 10px;	
}

.audio-wrappe-iframe {
	width: 100%;
}

/**********NAVIGATION BAR**********/

.quick-bio-container {
	width: 100%;
	height: 100px;
	line-height: 100px;
	text-align: left;
}

.quick-bio {
	display: inline-block;
	vertical-align: middle;
	line-height: normal;
}

p.quick-bio {
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 18px;
	color: #000;
	margin-top: 10px;
}

#nav-container {
	text-align: justify;
    -ms-text-justify: distribute-all-lines;
    text-justify: distribute-all-lines;	
	width: 100%;
	height: 100px;
	line-height: 100px;
}

#nav-container:after {
    content: '';
    width: 100%;
    display: inline-block;
}

.nav-item-line {
	width: 1px;
	vertical-align: top;
	display: inline-block;
	*display: inline;
	background: #CCC;
}

.nav-item-1 {
	width: 80px;
	vertical-align: top;
	display: inline-block;
	*display: inline;
	text-align: center;
}

.nav-item-2 {
	width: 34px;
    vertical-align: top;
    display: inline-block;
    *display: inline;
	text-align: center;
}

.nav-item-3 {
	width: 81px;
    vertical-align: top;
    display: inline-block;
    *display: inline;
	text-align: right;
}

a.nav-link {
	text-decoration: none;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 22px;
	color: #000;
}

a.nav-link-blue {
	text-decoration: none;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 22px;
	color: #06F;
}

a.nav-link-blue:hover {
	text-decoration: none;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 22px;
	color: #09F;
}

a.nav-link:hover {
	text-decoration: none;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 22px;
	color: #09F;
}

/**********FOOTER**********/

.rule{
	width: 100%;
	height:1px;
	border-bottom: 1px solid #CCC;
	clear:both;
	padding-top:20px;
	margin-right: 20px;
}

.footer-list {
	margin-top: -20px;
}

ul.footer-list {
	list-style: none;
	margin-left: -40px;
}

ul.footer-list li{
	display: inline;
}

a.footer-link {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #000;
	text-decoration: none;	
	padding-right: 20px;
}

a.footer-link:hover {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #09F;
	text-decoration: none;	
	padding-right: 20px;
}

.footer-copyright {
	margin-top: -20px;	
}

p.footer-copyright {
	float: right;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #000;
	text-decoration: none;	
	padding-right: 20px;	
}

a.footer-contact {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #666;
	text-decoration: none;		
}

a.footer-contact:hover {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #09F;
	text-decoration: none;		
}

 @media handheld, only screen and (max-width: 767px) {
	 
.homepage-header-spacer {
	padding-top:0px;
}

h1.headline {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 50px;
	color: #fff;
	padding: 10px 20px 20px 20px;
}
	 
h1.headline-vr {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 50px;
	color: #fff;
	padding: 10px 20px 20px 20px;
}
	 
#headerlogo {
	background-image:url('/img/ryanlestermusic-logo.png');
	background-repeat: no-repeat;
	display:block;
	background-size: 180px;
	margin-top: 22px;
	text-indent:-9999px;
}

p.subtitle-name {
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 21px;
	margin-top: -47px;
	margin-left: 190px;
	color: #06F;
}

p.listen-section {
	color: #fff;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 20px;
}
	
.audio-wrapper {
	padding-right: 0px;	
}
	
.video-resize {
	padding-right: 0px;
}

.bio-container {
	margin-top: 100px;
	background: rgb(0, 0, 0);
    background: rgba(0, 0, 0, .5);
	padding: 1px 20px 1px 20px;
}

p.footer-copyright {
	float: left;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 12px;
	color: #000;
	text-decoration: none;	
	padding-right: 20px;	
}

.header-container {
	position: fixed;
    top: 0;
    height: 55px;
    width: 100%;
    background-color: #fff;
    z-index: 30;	
	box-shadow: 0px 0px 30px  0px rgba(0, 0, 0, 0.5);
}

.header-text {
	margin-top: -25px;	
}

.project-header {
	margin-top: 55px;
}

p.concert-audio-title {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	font-size: 20px;
	line-height: 30px;
	color: #333;
	background: #fff;
	margin-left: -20px;
	padding-left: 20px;
	padding-top: 5px;
	padding-bottom: 5px;
	margin-bottom: -10px;
	margin-top: 10px;
	margin-right: -20px;
}

.concert-music-padding {
	margin-top: 55px;	
}
	
}