/* normalize-scss 3.0.1+normalize.3.0.1 | MIT/GPLv2 License | bit.ly/normalize-scss */
/* Base ========================================================================== */
/** Establish a vertical rhythm unit using $base-font-size, $base-line-height, and $rhythm-unit variables. Also, correct text resizing oddly in IE 6/7 when body `font-size` is set using `em` units. */
html { font-size: 100%; line-height: 1.5em; }

/** 1. Set default font family to sans-serif. 2. Prevent iOS text size adjust after orientation change, without disabling user zoom. */
html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ }

/** Remove default margin. */
body { margin: 0; }

/* HTML5 display definitions ========================================================================== */
/** Correct `block` display not defined for any HTML5 element in IE 8/9. Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. Correct `block` display not defined for `main` in IE 11. */
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; }

/** 1. Correct `inline-block` display not defined in IE 8/9. 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */
audio, canvas, progress, video { display: inline-block; /* 1 */ *display: inline; *zoom: 1; vertical-align: baseline; /* 2 */ }

/** Prevent modern browsers from displaying `audio` without controls. Remove excess height in iOS 5 devices. */
audio:not([controls]) { display: none; height: 0; }

/** Address `[hidden]` styling not present in IE 8/9/10. */
[hidden] { display: none; }

/** Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. */
template { display: none; }

/* Links ========================================================================== */
/** Remove the gray background color from active links in IE 10. */
a { background: transparent; }

/** Improve readability when focused and also mouse hovered in all browsers. */
a:active, a:hover { outline: 0; }

/* Text-level semantics ========================================================================== */
/** Address styling not present in IE 8/9/10/11, Safari, and Chrome. */
abbr[title] { border-bottom: 1px dotted; }

/** Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */
b, strong { font-weight: bold; }

/** Set 1 unit of vertical rhythm on the top and bottom margin. */
blockquote { margin: 1.5em 40px; }

/** Address styling not present in Safari and Chrome. */
dfn { font-style: italic; }

/** Address variable `h1` font-size and margin within `section` and `article` contexts in Firefox 4+, Safari, and Chrome. */
h1 { /* Set the font-size and line-height while keeping a proper vertical rhythm. */ font-size: 2em; line-height: 1.5em; /* Set 1 unit of vertical rhythm on the top and bottom margins. */ margin-top: 0.75em; margin-bottom: 0.75em; }

h2 { font-size: 1.5em; line-height: 2em; margin-top: 1em; margin-bottom: 1em; }

h3 { font-size: 1.17em; line-height: 1.28205em; margin-top: 1.28205em; margin-bottom: 1.28205em; }

h4 { font-size: 1em; line-height: 1.5em; margin-top: 1.5em; margin-bottom: 1.5em; }

h5 { font-size: 0.83em; line-height: 1.80723em; margin-top: 1.80723em; margin-bottom: 1.80723em; }

h6 { font-size: 0.67em; line-height: 2.23881em; margin-top: 2.23881em; margin-bottom: 2.23881em; }

/** Address styling not present in IE 8/9. */
mark { background: #ff0; color: #000; }

/** Set 1 unit of vertical rhythm on the top and bottom margin. */
p, pre { margin: 1.5em 0; }

/** Address inconsistent and variable font size in all browsers. */
small { font-size: 80%; }

/** Prevent `sub` and `sup` affecting `line-height` in all browsers. */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

/* Lists ========================================================================== */
/** Address margins set differently in IE 6/7. */
dl, menu, ol, ul { margin: 1.5em 0; }

dd { margin: 0 0 0 40px; }

/** Address paddings set differently in IE 6/7. */
menu, ol, ul { padding: 0 0 0 40px; }

/** Correct list images handled incorrectly in IE 7. */
nav ul, nav ol { list-style: none; list-style-image: none; }

/* Embedded content ========================================================================== */
/** Remove border when inside `a` element in IE 8/9/10. */
img { border: 0; /* Improve image quality when scaled in IE 7. */ -ms-interpolation-mode: bicubic; }

/** Correct overflow not hidden in IE 9/10/11. */
svg:not(:root) { overflow: hidden; }

/* Grouping content ========================================================================== */
/** Address margin not present in IE 8/9 and Safari. */
figure { margin: 1.5em 40px; }

/** Address differences between Firefox and other browsers. */
hr { -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; height: 0; }

/** Contain overflow in all browsers. */
pre { overflow: auto; }

/** Address odd `em`-unit font size rendering in all browsers. */
code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }

/* Forms ========================================================================== */
/** Known limitation: by default, Chrome and Safari on OS X allow very limited styling of `select`, unless a `border` property is set. */
/** Correct margin displayed oddly in IE 6/7. */
form { margin: 0; }

/** 1. Correct color not being inherited. Known issue: affects color of disabled elements. 2. Correct font properties not being inherited. 3. Address margins set differently in Firefox 4+, Safari, and Chrome. 4. Address `font-family` inconsistency between `textarea` and other form in IE 7 5. Improve appearance and consistency with IE 6/7. */
button, input, optgroup, select, textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ *font-family: sans-serif; /* 4 */ *vertical-align: middle; /* 5 */ }

/** Address `overflow` set to `hidden` in IE 8/9/10/11. */
button { overflow: visible; }

/** Address inconsistent `text-transform` inheritance for `button` and `select`. All other form control elements do not inherit `text-transform` values. Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. Correct `select` style inheritance in Firefox. */
button, select { text-transform: none; }

/** 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. 2. Correct inability to style clickable `input` types in iOS. 3. Improve usability and consistency of cursor style between image-type `input` and others. 4. Remove inner spacing in IE 7 without affecting normal text inputs. Known issue: inner spacing remains in IE 6. */
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ *overflow: visible; /* 4 */ }

/** Re-set default cursor for disabled elements. */
button[disabled], html input[disabled] { cursor: default; }

/** Remove inner padding and border in Firefox 4+. */
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/** Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet. */
input { line-height: normal; }

/** It's recommended that you don't attempt to style these elements. Firefox's implementation doesn't respect box-sizing, padding, or width.  1. Address box sizing set to `content-box` in IE 8/9/10. 2. Remove excess padding in IE 8/9/10. 3. Remove excess padding in IE 7. Known issue: excess padding remains in IE 6. */
input[type="checkbox"], input[type="radio"] { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ *height: 13px; /* 3 */ *width: 13px; /* 3 */ }

/** Fix the cursor style for Chrome's increment/decrement buttons. For certain `font-size` values of the `input`, it causes the cursor style of the decrement button to change from `default` to `text`. */
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }

/** 1. Address `appearance` set to `searchfield` in Safari and Chrome. 2. Address `box-sizing` set to `border-box` in Safari and Chrome (include `-moz` to future-proof). */
input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; /* 2 */ /** Remove inner padding and search cancel button in Safari and Chrome on OS X. Safari (but not Chrome) clips the cancel button when the search input has padding (and `textfield` appearance). */ }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** Define consistent border, margin, and padding. */
fieldset { margin: 0 2px; /* Apply borders and padding that keep the vertical rhythm. */ border-color: #c0c0c0; border-top-width: 0.0625em; border-top-style: solid; padding-top: 0.4625em; border-bottom-width: 0.0625em; border-bottom-style: solid; padding-bottom: 0.9125em; border-left-width: 0.0625em; border-left-style: solid; padding-left: 0.875em; border-right-width: 0.0625em; border-right-style: solid; padding-right: 0.875em; }

/** 1. Correct `color` not being inherited in IE 8/9/10/11. 2. Remove padding so people aren't caught out if they zero out fieldsets. 3. Correct alignment displayed oddly in IE 6/7. */
legend { border: 0; /* 1 */ padding: 0; /* 2 */ *margin-left: -7px; /* 3 */ }

/** Remove default vertical scrollbar in IE 8/9/10/11. */
textarea { overflow: auto; }

/** Don't inherit the `font-weight` (applied by a rule above). NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */
optgroup { font-weight: bold; }

/* Tables ========================================================================== */
/** Remove most spacing between table cells. */
table { border-collapse: collapse; border-spacing: 0; }

td, th { padding: 0; }

html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

body { font-family: 'TradeGothic',Arial,sans-serif; font-size: 18px; line-height: 1em; letter-spacing: 0.03em; }
@media (max-width: 550px) { body { font-size: 17px; } }
@media (max-width: 350px) { body { font-size: 16px; } }

.clearfix:after { content: ""; display: table; clear: both; }

.container { padding: 0px; }
.home .container { padding: 40px; }

.page-dc .tracks { position: relative; width: 100%; min-width: 1250px; }
.page-dc .tracks .track-1 { width: 11.2%; height: 2.153846154%; left: 5.76%; top: 3.6%; }
.page-dc .tracks .track-2 { width: 7.2%; height: 2.153846154%; left: 6.64%; top: 6.646153846%; }
.page-dc .tracks .track-3 { width: 11.2%; height: 2.153846154%; left: 6.24%; top: 9.569230769%; }
.page-dc .tracks .track-4 { width: 13.2%; height: 2.153846154%; left: 5.92%; top: 13.01538462%; }
.page-dc .tracks .track-5 { width: 6.4%; height: 2.153846154%; left: 6.48%; top: 16.27692308%; }
.page-dc .tracks .track-6 { width: 4.4%; height: 2.153846154%; left: 8.08%; top: 19.78461538%; }
.page-dc .tracks .track-7 { width: 11.36%; height: 2.153846154%; left: 5.92%; top: 23.35384615%; }
.page-dc .tracks .track-8 { width: 9.6%; height: 2.153846154%; left: 6.24%; top: 27.13846154%; }
.page-dc .tracks .track-9 { width: 14%; height: 2.153846154%; left: 6.24%; top: 30.70769231%; }

.page-tyls .tracks { position: relative; width: 100%; min-width: 1250px; }
.page-tyls .tracks .track-1 { width: 9.20%; height: 2.153846154%; left: 10.12%; top: 6.52%; }
.page-tyls .tracks .track-2 { width: 12.92%; height: 2.153846154%; left: 10.20%; top: 9.66%; }
.page-tyls .tracks .track-3 { width: 14.12%; height: 2.153846154%; left: 10.92%; top: 13.42%; }
.page-tyls .tracks .track-4 { width: 8.56%; height: 2.153846154%; left: 9.20%; top: 16.98%; }
.page-tyls .tracks .track-5 { width: 10.56%; height: 2.153846154%; left: 11.12%; top: 20.55%; }
.page-tyls .tracks .track-6 { width: 11.36%; height: 2.153846154%; left: 11.32%; top: 24.15%; }
.page-tyls .tracks .track-7 { width: 9.52%; height: 2.153846154%; left: 10.64%; top: 27.48%; }
.page-tyls .tracks .track-8 { width: 15.52%; height: 2.153846154%; left: 10.68%; top: 31.45%; }
.page-tyls .tracks .track-9 { width: 15.92%; height: 2.153846154%; left: 10.64%; top: 35.23%; }

a { color: #9c0c0c; text-decoration: none; border-bottom: solid 2px transparent; }
.no-touch a:HOVER { border-bottom-color: #9c0c0c; }

.no-touch h1 a:HOVER { border-bottom-color: transparent; }

p { margin: 0 0 1.5em; line-height: 1.5em; }

.sprite { background: url(/wp-content/themes/beachhouse/img/sprite.png) 0 0 no-repeat; background-image: url(/wp-content/themes/beachhouse/img/sprite.svg); background-size: 328px 160px; }

.album { position: fixed; top: 0; left: 0; width: 100%; height: 100%; }
.album a { display: block; border: 0; margin: 0 auto; width: 100%; max-width: 525px; }
.no-touch .album a:HOVER { border: 0; }
.album img { display: block; width: 100%; height: auto; }
.album.twofer { width: 94%; left: 3%; }
.album.twofer a { width: 45%; }
.flexbox .album { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; -webkit-box-pack: center; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; flex-wrap: wrap; }
.no-flexbox .album a { position: relative; top: 50%; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); }
@media (max-aspect-ratio: 1 / 1) { .album { position: relative; width: auto; height: auto; top: auto; left: auto; bottom: auto; right: auto; }
  .album.twofer { width: 100%; left: auto; }
  .album a, .album.twofer a { margin: 40px; width: auto; } }
@media (min-aspect-ratio: 2 / 1) { .album a, .album.twofer a { width: 36%; } }
@media (max-width: 630px) { .album a, .album.twofer a { width: auto; margin: 0; }
  .album a:first-of-type, .album.twofer a:first-of-type { margin-bottom: 20px; } }

.track-links { position: relative; overflow-x: hidden; }
.track-links img { width: 100%; min-width: 1250px; height: auto; display: block; }
.track-links .tracklist-link { position: absolute; display: block; border: 0; text-indent: -9999px; }
.no-touch .track-links .tracklist-link:HOVER { border: 0; }

@media (max-width: 630px) { .home .container { padding: 20px; } }
.tracklinks { margin: 0; padding: 0; list-style: none; }
.tracklinks li { font-size: 18px; line-height: 1; margin-bottom: 14px; }
.tracklinks li a { display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; color: #f8f8f8; }
.no-touch .tracklinks li a:HOVER { border-bottom-color: #f8f8f8; }

.hotspotArea { position: relative; }
.hotspotArea a { display: block; text-decoration: none; cursor: url(/wp-content/themes/beachhouse/img/cursor.png), auto; }
.hotspotArea a:HOVER { border: none; }
.hotspotArea img { width: 100%; height: auto; display: block; }
@media (max-width: 1250px) { .hotspotArea { position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow: scroll; }
  .hotspotArea .hotspot-wrap { position: absolute; top: 0; left: 0; width: 1250px; height: auto; }
  .hotspotArea .hotspot-wrap a.disabled { pointer-events: none; } }
.hotspotArea .track-link:BEFORE { position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ""; background-position: 0 0; background-repeat: no-repeat; background-size: 100% auto; display: none; }
.dc-10-37 .hotspotArea .track-link:BEFORE, .dc-1037-2 .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/1037.gif); }
.dc-beyond-love .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/beyond-love.gif); }
.dc-bluebird .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/bluebird.gif); }
.dc-days-of-candy .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/days-of-candy.gif); }
.dc-levitation .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/levitation.gif); }
.dc-ppp .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/ppp.gif); }
.dc-space-song .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/space-song.gif); }
.dc-sparks .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/sparks.gif); }
.dc-wildflower .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/wildflower.gif); }
.tyls-majorette .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/majorette.gif); }
.tyls-shes-so-lovely .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/shes-so-lovely.gif); }
.tyls-all-your-yeahs .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/all-your-yeahs.gif); }
.tyls-one-thing .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/one-thing.gif); }
.tyls-common-girl .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/common-girl.gif); }
.tyls-the-traveller .hotspotArea .track-link:BEFORE, .tyls-the-traveler .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/the-traveler.gif); }
.tyls-rough-song .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/rough-song.gif); }
.tyls-elegy-to-the-void .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/elegy-to-the-void.gif); }
.tyls-somewhere-tonight .hotspotArea .track-link:BEFORE { background-image: url(/wp-content/themes/beachhouse/img/somewhere-tonight.gif); }
.xmarx .hotspotArea .track-link:BEFORE { display: block; }

.mobile-close { position: fixed; top: 0; right: 0; width: 50px; height: 50px; background: url(/wp-content/themes/beachhouse/img/cursor.png) 50% 50% no-repeat #FFF; z-index: 20; display: none; }
.touch .mobile-close.active { display: block; }
.admin-bar .mobile-close { top: 32px; }
@media (max-width: 767px) { .admin-bar .mobile-close { top: 46px; } }

.overlay { display: none; position: fixed; z-index: 5; pointer-events: none; width: 100%; height: 100%; top: 0; left: 0; background-color: #FFF; -moz-background-size: contain; -o-background-size: contain; -webkit-background-size: contain; background-size: contain; background-repeat: no-repeat; background-position: 50% 50%; }
.overlay.active { display: block; }
.touch .overlay.active { pointer-events: auto; }
.overlay iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.hotspot { position: absolute; cursor: none; }
.touch .hotspot { border-bottom: 1px solid #ccc; }

a[href$=jpg], a[href$=jpeg], a[href$=jpe], a[href$=png], a[href$=gif] { text-decoration: none; border: 0 none; }

.touch .hide-touch { display: none; }

.show-touch { display: none; }

.touch .show-touch { display: block; }

iframe[name='google_conversion_frame'] { height: 0 !important; width: 0 !important; line-height: 0 !important; font-size: 0 !important; margin-top: -13px; float: left; }
