* { margin: 0; padding: 0; }

body { background: #000; color: #bac1c1; font: normal 0.9em/1.5 HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif; }

h1, h2, h3, h4, h5 { line-height: 1; font-weight: bold; }

h1 { font-size: 1.5em; }

h2 { font-size: 1.2em; }

h3 { font-size: 1.1em; font-style: oblique; }

ol, ul { margin-left: 1.2em; }

p { font-size: 1em; line-height: 1.4; text-align: left; margin-bottom: 0.5em; }

a, a:link { text-decoration: none; color: #e0a547; }

a:hover { text-decoration: underline; color: #fff; }

img { max-width: 100%; height: auto; }

a img { border-width: 0; }

img.bordered { border: 2px solid white; }

blockquote { font-style: oblique; color: white; }

.attr { font-size: 93%; font-weight: bold; margin-bottom: 2em; }

#container { position: relative; width: 900px; height: 672px; margin: 40px auto 0 auto; background-image: url(img/bg/InformationCrop.jpg); overflow: visible; }

#header h1, #header h2 { text-indent: -999em; overflow: hidden; position: absolute; }

#header h1 { width: 232px; height: 55px; top: 0; left: 24px; }

#header h1 a { display: block; background-image: url(img/eb/EdBreazealeBlue.png); width: 232px; height: 55px; }

#header h2 { display: none; /* hiding this because we are lazy and putting the two pieces in the h1 image */ }

#content { position: absolute; top: 60px; left: 400px; width: 500px; height: 565px; background-image: url(img/bg/InfoBG.png); }

#content_inner { margin: 10px 10px 0px 20px; }

#content_inner h2 { color: #f6ca46; font-size: 1.4em; }

#content_inner h3 { font-style: normal; margin: 0 0 1em; }

#content_inner p + h3, #content_inner ul + h3, #content_inner ol + h3 { margin-top: 1em; }

#content_inner h4 { font-style: normal; margin: 1em 0 0.3em; }

#content .scroller { margin-top: 20px; overflow: auto; height: 500px; padding-right: 10px; }

#side-content { position: absolute; width: 360px; height: 370px; top: 150px; left: 2em; }

#nav_main { position: absolute; top: 515px; left: 30px; width: 190px; font-family: HelveticaNeue-Light, "Helvetica Neue Light", Helvetica, Arial, sans-serif; }

#nav_main ul { margin-left: 0; padding-left: 1.25em; font-size: 1.3em; list-style-image: url(img/plus_blue.png); }

#nav_main ul li a { display: block; }

#nav_main ul li a.active { color: #bac1c1; }

#nav_inner { position: absolute; top: 0; left: 0; right: 0; padding: 10px 8px; font-family: HelveticaNeue-Light, "Helvetica Neue Light", Helvetica, Arial, sans-serif; background: rgba(32, 0, 0, 0.7); }

#nav_inner ul { margin: 0; padding: 0; text-align: right; }

#nav_inner li { display: inline-block; text-align: left; list-style: none; margin-right: 0.5em; font-size: 1.2em; }

#nav_inner li a { display: block; background: url(img/plus_blue.png) 0 center no-repeat; padding-left: 20px; }

#nav_inner li a.active { color: #bac1c1; }

#nav_inner li:first-child { width: 8.75em; }

#nav_inner li:nth-child(2) { width: 3em; }

#nav_inner li:nth-child(3) { width: 6.5em; }

#nav_inner li:nth-child(4) { width: 9.5em; }

#nav_inner li:last-child { width: 6em; margin-right: 0; }

/* @group Home */
body.home #container { margin-top: 20px; background-image: url(img/bg/HomeCrop.jpg); }

body.home #header h1 { top: 110px; left: 47px; }

body.home #header h1 a { background-image: url(img/eb/EdBreazealeRed.png); }

body.home #nav_main { left: 710px; top: 480px; }

body.home #nav_main a { color: #8f8c4d; }

body.home #nav_main ul { list-style-image: url(img/plus_red.png); }

body.home #nav_main ul a:hover { color: #72141d; }

body.home #homeplayer { position: absolute; top: 650px; left: 730px; width: 55px; font-size: 11px; color: #444; }

#mp3button { float: right; height: 17px; width: 17px; }

/* @end */
/* @group Media */
body.media #container { margin-top: 20px; background-image: url(img/bg/AudioVideoCrop.jpg); }

body.media #header h1 { top: 600px; left: 0; }

body.media #header h1 a { background-image: url(img/eb/EdBreazealeLavender.png); }

body.media #nav_main { left: 720px; top: 560px; }

body.media #nav_main a { color: #e5d36d; }

body.media #nav_main ul { list-style-image: url(img/plus_lavender.png); }

body.media #nav_main ul a:hover, body.media #nav_main ul a.active { color: #604b4c; }

ul.media_list { margin: 0; padding: 0; }

ul.media_list li { position: absolute; display: block; top: 0; left: 0; }

ul.media_list li a { color: #e6d46d; font-size: 1.2em; }

ul.media_list ul { font-size: 0.8em; background: #201817; border: 1px solid #5a5536; padding: 2px 6px 4px; margin: 0; width: 72px; /*display: none;*/ }

ul.media_list ul li { position: static; display: list-item; list-style: none; line-height: 1.2; }

ul.media_list ul li a { color: #fffcc3; font-weight: bold; font-size: 12px; }

#media_1 { top: 130px; left: 20px; }

#media_2 { top: 60px; left: 110px; }

#media_3 { top: 20px; left: 320px; }

#media_3_5 { top: 250px; left: 0; }

#media_4 { top: 30px; left: 470px; }

#media_5 { top: 80px; left: 660px; }

#media_6 { top: 160px; left: 710px; }

#media_7 { top: 250px; left: 770px; }

#media_8 { top: 360px; left: 790px; }

#media_9, .audio #media_7 { top: 460px; left: 730px; }

#media_10 { top: 500px; left: 600px; }

.audio #media_2 { top: 50px; left: 170px; }

.audio #media_3 { top: 20px; left: 370px; }

.audio #media_4 { top: 55px; left: 560px; }

.audio #media_5 { top: 160px; left: 710px; }

.audio #media_6 { top: 260px; left: 760px; }

#all-players { display: none; }

#videoplayer { position: absolute; width: 535px; height: 300px; background: black; border: 1px solid #332a2c; top: 140px; left: 140px; display: none; }

#musicplayer, #me-audio, #mep_0 { position: absolute; top: 180px; left: 280px; }

.video-wrapper { position: relative; height: 0; padding-bottom: 56.25%; overflow: hidden; max-width: 100%; clear: both; }

.video-wrapper div, .video-wrapper embed, .video-wrapper object, .video-wrapper iframe { position: absolute; width: 100%; height: 100%; left: 0; top: 0; }

.media #credits { display: none; font-size: 0.8em; position: absolute; top: 240px; left: 300px; background: #2a181e; padding: 1em; width: 220px; border: 1px solid #57464c; color: #cfcfcf; }

.media #show_credits { position: absolute; top: 600px; left: 330px; width: 250px; text-align: center; font-size: 0.75em; }

/* @end */
body.contact #content p { color: #e3eeee; font-size: 1.2em; margin-top: 0; }

body.contact #content p a { color: #e3eeee; }

body.contact #content h3 { font-size: 0.9em; font-weight: normal; font-style: normal; color: #bbc2c2; margin-bottom: 0.5em; margin-top: 1.5em; }

body.contact #content h3:first-child { margin-top: 0; }

body.lessons { background: #D0D2CD; }

.lessons #container { background-image: url(img/bg/bg-lessons-notext.jpg); background-size: cover; background-position: right center; }

.lessons #header h1 { width: 190px; height: 85px; top: 2.5em; left: 1.5em; }

.lessons.lessons--home #header h1 { width: 370px; height: 175px; top: 70px; }

.lessons #content { background: rgba(32, 0, 0, 0.7); }

.lessons #header h1 a { width: 100%; height: 100%; background-image: url(img/eb/eb-lesson-studio.png); background-size: contain; background-repeat: no-repeat; }

.lessons #nav_main { padding: 0.5em; background: rgba(32, 0, 0, 0.7); }

#video-grid { position: relative; top: 4em; left: 240px; width: 660px; height: 595px; zoom: 1; }

#video-grid::after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

#video-grid .entry { display: inline-block; width: 45%; margin: 0 2.5% 2.5% 0; }

@media screen and (max-width: 899px) { #header { position: relative; }
  #header h1 { position: relative; top: 0; left: 0; margin: 0 auto; }
  #content { position: relative; top: 0; left: 0; width: 100%; height: auto; background-position: center top; }
  #content .scroller { margin-top: 1em; overflow: visible; height: auto; padding: 0 0 1em; }
  #nav_main { position: fixed; top: auto; bottom: 0; left: 0; width: 100%; right: auto; padding: 1em; box-sizing: border-box; background-color: rgba(8, 8, 8, 0.8); }
  #nav_main ul { text-align: left; zoom: 1; }
  #nav_main ul::after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
  #nav_main ul li { float: left; margin-right: 2em; }
  body.home #header h1 { top: 1em; left: 1.5em; }
  body.home #nav_main { top: auto; left: auto; right: 0; bottom: 0; }
  body.home #homeplayer { left: 1em; right: auto; position: relative; top: 60vh; }
  #container { width: auto; max-width: 100%; background-size: contain; background-repeat: no-repeat; background-position: center 2em; height: auto; min-height: 480px; margin-top: 1em; }
  .home #container { width: auto; max-width: 100%; height: auto; min-height: 480px; }
  .lessons #container { margin: 0; background-position: center top; }
  #video-grid { position: relative; top: 4em; left: 0; width: 100%; height: auto; padding: 5em 0 10em; }
  #video-grid .entry { display: block; width: 95%; margin: 0 auto 1em; }
  .lessons #container, .lessons.lessons--home #container { padding-bottom: 10em; }
  .lessons #header, .lessons.lessons--home #header { position: relative; width: 100%; }
  .lessons #header h1, .lessons.lessons--home #header h1 { position: relative; top: 0; left: 0; width: 100%; height: 80px; }
  .lessons #header h1 a, .lessons.lessons--home #header h1 a { background-position: center top; }
  .lessons #content, .lessons.lessons--home #content { position: relative; width: 100%; top: 5.1em; left: 0; bottom: auto; right: auto; padding-top: 0.5em; height: auto; }
  .lessons #content .scroller, .lessons.lessons--home #content .scroller { height: auto; overflow: visible; }
  .lessons #side-content, .lessons.lessons--home #side-content { position: relative; width: 100%; left: 0; right: auto; top: 0; bottom: auto; height: auto; padding-bottom: 10em; }
  .lessons #nav_inner, .lessons.lessons--home #nav_inner { top: 80px; }
  .lessons #nav_inner ul, .lessons.lessons--home #nav_inner ul { text-align: center; }
  .lessons #nav_main, .lessons.lessons--home #nav_main { background-color: rgba(16, 0, 0, 0.8); }
  body.media #header h1 { top: 0; }
  body.media #nav_main { left: 0; top: auto; }
  body.media #container { padding-bottom: 8em; }
  body.media #container .media_list { padding-top: 1em; }
  body.media #container .media_list > .link_audio { position: relative; top: 0; left: 2em; width: 90%; }
  body.media #container .media_list > .link_video { position: relative; top: 0; left: 2em; width: 90%; }
  body.media #all-players { width: 95%; left: 2em; }
  body.media #all-players #videoplayer { position: relative; max-width: 535px; width: 90%; height: auto; top: 0; left: 2em; display: none; }
  body.media #all-players #musicplayer, body.media #all-players #me-audio, body.media #all-players #mep_0 { position: relative; top: 1em; left: 2em; }
  body.media #credits { display: block !important; position: relative; top: 2em; left: 2em; max-width: 90%; } }

@media screen and (max-width: 480px) { body.home #header h1 { top: 0.5em; }
  #content { padding-bottom: 7em; }
  .lessons #content, .lessons.lessons--home #content { top: 6.75em; }
  body.media #container { padding-bottom: 12em; } }