/*!
Theme Name: Lightmark Media
Theme URI: http://underscores.me/
Author: Lightmark Media
Author URI: https://lightmarkmedia.com
Description: Custom theme developed by Lightmark Media
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lightmarkmedia
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Lightmark Media is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/
/*==============================================================
# NORMALIZE
==============================================================*/
html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

body { margin: 0; }

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

audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }

audio:not([controls]) { display: none; height: 0; }

[hidden], template { display: none; }

a { background-color: transparent; }

a:active, a:hover { outline: 0; }

abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }

dfn { font-style: italic; }

h1 { font-size: 2em; margin: 0.67em 0; }

mark { background: #ff0; color: #000; }

small { font-size: 80%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

img { border: 0; }

svg:not(:root) { overflow: hidden; }

figure { margin: 1em 40px; }

hr { box-sizing: content-box; height: 0; }

pre { overflow: auto; }

code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }

button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }

button { overflow: visible; }

button, select { text-transform: none; }

button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }

button[disabled], html input[disabled] { cursor: default; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

input { line-height: normal; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }

input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

legend { border: 0; padding: 0; }

textarea { overflow: auto; }

optgroup { font-weight: bold; }

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

td, th { padding: 0; }

/*==============================================================
# ELEMENTS - Core styles
==============================================================*/
/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
html { box-sizing: border-box; font-size: 18px; height: 100%; width: 100%; }

*, *:before, *:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ box-sizing: inherit; }

body { overflow-x: hidden; background: #000; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; height: 100%; width: 100%; }

body, button, input, select, textarea { color: #fff; font-family: "Roboto", sans-serif; font-size: 18px; font-size: 1rem; line-height: 1.375em; }

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { clear: both; font-weight: 700; margin: 27px 0 13.5px; }

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .h1 a, .h2 a, .h3 a, .h4 a, .h5 a, .h6 a { color: inherit; font-weight: inherit; text-decoration: none; }

h1 a:hover, h1 a:active, h1 a:focus, h2 a:hover, h2 a:active, h2 a:focus, h3 a:hover, h3 a:active, h3 a:focus, h4 a:hover, h4 a:active, h4 a:focus, h5 a:hover, h5 a:active, h5 a:focus, h6 a:hover, h6 a:active, h6 a:focus, .h1 a:hover, .h1 a:active, .h1 a:focus, .h2 a:hover, .h2 a:active, .h2 a:focus, .h3 a:hover, .h3 a:active, .h3 a:focus, .h4 a:hover, .h4 a:active, .h4 a:focus, .h5 a:hover, .h5 a:active, .h5 a:focus, .h6 a:hover, .h6 a:active, .h6 a:focus { color: inherit; text-decoration: underline; }

h1, .h1 { font-size: 48px; font-size: 2.6666666667rem; line-height: 1.15; }

@media (max-width: 960px) { h1, .h1 { font-size: 36px; font-size: 2rem; line-height: 1.25; } }

@media (max-width: 760px) { h1, .h1 { font-size: 32px; font-size: 1.7777777778rem; line-height: 1.3; } }

h2, .h2 { font-size: 36px; font-size: 2rem; line-height: 1.25; }

@media (max-width: 960px) { h2, .h2 { font-size: 32px; font-size: 1.7777777778rem; line-height: 1.3; } }

h3, .h3 { font-size: 30px; font-size: 1.6666666667rem; line-height: 1.3; }

@media (max-width: 960px) { h3, .h3 { font-size: 24px; font-size: 1.3333333333rem; line-height: 1.4; } }

h4, .h4 { font-size: 24px; font-size: 1.3333333333rem; line-height: 1.4; }

h5, .h5 { font-size: 20px; font-size: 1.1111111111rem; line-height: 1.5; }

h6, .h6 { font-size: 18px; font-size: 1rem; line-height: 1.5; }

p { margin: 0 0 1.5em; }

dfn, cite, em, i { font-style: italic; }

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

q:before, q:after { content: ""; }

q { quotes: "" ""; }

address { margin: 0 0 1.5em; font-style: normal; }

pre { background: #eee; font-family: "Courier 10 Pitch", Courier, monospace; font-size: 15px; font-size: 0.9375rem; line-height: 1.6; margin-bottom: 1.6em; max-width: 100%; overflow: auto; padding: 1.6em; }

code, kbd, tt, var { font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 15px; font-size: 0.9375rem; }

abbr, acronym { border-bottom: 1px dotted #666; cursor: help; }

mark, ins { background: #fff9c0; text-decoration: none; }

big { font-size: 125%; }

small { font-size: 16px; font-size: 0.8888888889rem; }

hr { background-color: #bfbfbf; border: 0; height: 2px; margin: 1.5em 0; }

ul, ol { margin: 0 0 1.5em 0; }

ul { list-style: disc; }

ol { list-style: decimal; }

li > ul, li > ol { margin-bottom: 0; margin-left: 1.5em; }

li { margin: 0 0 0.5em; }

dt { font-weight: bold; }

dd { margin: 0 1.5em 1.5em; }

figure { margin: 0 0 1.5em; }

img { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ }

table { margin: 0 0 1.5em; width: 100%; }

embed, iframe, object { max-width: 100%; }

/*--------------------------------------------------------------
# Links
--------------------------------------------------------------*/
a { color: #99cc99; font-weight: 700; text-decoration: none; transition: color 0.2s linear; }

a img { opacity: 1; transition: opacity 0.2s linear; }

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

a:hover img, a:focus img, a:active img { opacity: 0.8; }

a:focus { outline: thin dotted; }

a:hover, a:active { outline: 0; }

/*==============================================================
# OBJECTS - Classes used globally for layout
==============================================================*/
.clear:after { content: ""; clear: both; display: table; }

.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; }

.screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; -webkit-clip-path: none; clip-path: none; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; }

/*--------------------------------------------------------------
# Wrappers / Containers
--------------------------------------------------------------*/
.wrapper { position: relative; height: 100%; }

.max-container { width: 1600px; margin: 0 auto; max-width: 100%; }

.xxl-container, .xl-container, .lg-container, .md-container, .sm-container, .xs-container { max-width: 92%; margin: 0 auto; }

.xxl-container { width: 1400px; }

.xl-container { width: 1170px; }

.lg-container { width: 960px; }

.md-container { width: 760px; }

.sm-container { width: 650px; }

.xs-container { width: 550px; }

.container-collapse { max-width: 100%; }

.full-width { width: 100vw; max-width: 1170px; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; }

.full-width > div { margin-left: auto; margin-right: auto; }

.medium-only, .small-only { display: none; }

/*--------------------------------------------------------------
# Grid
--------------------------------------------------------------*/
.grid-inline-block { text-align: center; }

.grid-inline-block > * { display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; }

.grid-inline { display: inline-flex; flex-wrap: nowrap; }

.grid { display: flex; flex-wrap: wrap; }

.grid--between { justify-content: space-between; }

.grid--around { justify-content: space-around; }

.grid--evenly { justify-content: space-evenly; }

.grid--center { justify-content: center; }

.grid--vertical-center { align-items: center; }

.col-reverse { order: 1; }

@media (max-width: 1170px) { .col-reverse--xl { order: 0; } }

@media (max-width: 960px) { .col-reverse--lg { order: 0; } }

@media (max-width: 760px) { .col-reverse--md { order: 0; } }

@media (max-width: 650px) { .col-reverse--sm { order: 0; } }

@media (max-width: 550px) { .col-reverse--xs { order: 0; } }

.col-1 { width: 6.9583333333%; }

.col-2 { width: 15.4166666667%; }

.col-3 { width: 23.875%; }

.col-4 { width: 32.3333333333%; }

.col-5 { width: 40.7916666667%; }

.col-6 { width: 49.25%; }

.col-7 { width: 57.7083333333%; }

.col-8 { width: 66.1666666667%; }

.col-9 { width: 74.625%; }

.col-10 { width: 83.0833333333%; }

.col-11 { width: 91.5416666667%; }

.col-12 { width: 100%; }

@media (max-width: 1400px) { .xxl-col-1 { width: 6.9583333333%; }
  .xxl-col-2 { width: 15.4166666667%; }
  .xxl-col-3 { width: 23.875%; }
  .xxl-col-4 { width: 32.3333333333%; }
  .xxl-col-5 { width: 40.7916666667%; }
  .xxl-col-6 { width: 49.25%; }
  .xxl-col-7 { width: 57.7083333333%; }
  .xxl-col-8 { width: 66.1666666667%; }
  .xxl-col-9 { width: 74.625%; }
  .xxl-col-10 { width: 83.0833333333%; }
  .xxl-col-11 { width: 91.5416666667%; }
  .xxl-col-12 { width: 100%; } }

@media (max-width: 1170px) { .xl-col-1 { width: 6.9583333333%; }
  .xl-col-2 { width: 15.4166666667%; }
  .xl-col-3 { width: 23.875%; }
  .xl-col-4 { width: 32.3333333333%; }
  .xl-col-5 { width: 40.7916666667%; }
  .xl-col-6 { width: 49.25%; }
  .xl-col-7 { width: 57.7083333333%; }
  .xl-col-8 { width: 66.1666666667%; }
  .xl-col-9 { width: 74.625%; }
  .xl-col-10 { width: 83.0833333333%; }
  .xl-col-11 { width: 91.5416666667%; }
  .xl-col-12 { width: 100%; } }

@media (max-width: 960px) { .lg-col-1 { width: 6.9583333333%; }
  .lg-col-2 { width: 15.4166666667%; }
  .lg-col-3 { width: 23.875%; }
  .lg-col-4 { width: 32.3333333333%; }
  .lg-col-5 { width: 40.7916666667%; }
  .lg-col-6 { width: 49.25%; }
  .lg-col-7 { width: 57.7083333333%; }
  .lg-col-8 { width: 66.1666666667%; }
  .lg-col-9 { width: 74.625%; }
  .lg-col-10 { width: 83.0833333333%; }
  .lg-col-11 { width: 91.5416666667%; }
  .lg-col-12 { width: 100%; } }

@media (max-width: 760px) { .md-col-1 { width: 6.9583333333%; }
  .md-col-2 { width: 15.4166666667%; }
  .md-col-3 { width: 23.875%; }
  .md-col-4 { width: 32.3333333333%; }
  .md-col-5 { width: 40.7916666667%; }
  .md-col-6 { width: 49.25%; }
  .md-col-7 { width: 57.7083333333%; }
  .md-col-8 { width: 66.1666666667%; }
  .md-col-9 { width: 74.625%; }
  .md-col-10 { width: 83.0833333333%; }
  .md-col-11 { width: 91.5416666667%; }
  .md-col-12 { width: 100%; } }

@media (max-width: 650px) { .sm-col-1 { width: 6.9583333333%; }
  .sm-col-2 { width: 15.4166666667%; }
  .sm-col-3 { width: 23.875%; }
  .sm-col-4 { width: 32.3333333333%; }
  .sm-col-5 { width: 40.7916666667%; }
  .sm-col-6 { width: 49.25%; }
  .sm-col-7 { width: 57.7083333333%; }
  .sm-col-8 { width: 66.1666666667%; }
  .sm-col-9 { width: 74.625%; }
  .sm-col-10 { width: 83.0833333333%; }
  .sm-col-11 { width: 91.5416666667%; }
  .sm-col-12 { width: 100%; } }

@media (max-width: 550px) { .xs-col-1 { width: 6.9583333333%; }
  .xs-col-2 { width: 15.4166666667%; }
  .xs-col-3 { width: 23.875%; }
  .xs-col-4 { width: 32.3333333333%; }
  .xs-col-5 { width: 40.7916666667%; }
  .xs-col-6 { width: 49.25%; }
  .xs-col-7 { width: 57.7083333333%; }
  .xs-col-8 { width: 66.1666666667%; }
  .xs-col-9 { width: 74.625%; }
  .xs-col-10 { width: 83.0833333333%; }
  .xs-col-11 { width: 91.5416666667%; }
  .xs-col-12 { width: 100%; } }

/*--------------------------------------------------------------
# Misc Layout
--------------------------------------------------------------*/
.gutter { padding-left: 3%; padding-right: 3%; }

.gutter--half { padding-left: 1.5%; padding-right: 1.5%; }

.gutter--reset { padding-left: 0; padding-right: 0; }

@media (max-width: 1170px) { .gutter--reset--xl { padding-left: 0; padding-right: 0; } }

@media (max-width: 960px) { .gutter--reset--lg { padding-left: 0; padding-right: 0; } }

@media (max-width: 760px) { .gutter--reset--md { padding-left: 0; padding-right: 0; } }

@media (max-width: 650px) { .gutter--reset--sm { padding-left: 0; padding-right: 0; } }

@media (max-width: 550px) { .gutter--reset--xs { padding-left: 0; padding-right: 0; } }

.section-padding { padding-top: 1.5em; padding-bottom: 1.5em; }

.section-padding--top { padding-top: 1.5em; }

.section-padding--bottom { padding-bottom: 1.5em; }

.section-padding--large { padding-top: 3em; padding-bottom: 3em; }

@media (max-width: 650px) { .section-padding--large { padding-top: 1.5em; padding-bottom: 1.5em; } }

.section-padding--large-top { padding-top: 3em; }

@media (max-width: 650px) { .section-padding--large-top { padding-top: 1.5em; } }

.section-padding--large-bottom { padding-bottom: 3em; }

@media (max-width: 650px) { .section-padding--large-bottom { padding-bottom: 1.5em; } }

.section-padding--x-large { padding-top: 6em; padding-bottom: 6em; }

@media (max-width: 960px) { .section-padding--x-large { padding-top: 3em; padding-bottom: 3em; } }

@media (max-width: 650px) { .section-padding--x-large { padding-top: 1.5em; padding-bottom: 1.5em; } }

.section-padding--x-large-top { padding-top: 6em; }

@media (max-width: 960px) { .section-padding--x-large-top { padding-top: 3em; } }

@media (max-width: 650px) { .section-padding--x-large-top { padding-top: 1.5em; } }

.section-padding--x-large-bottom { padding-bottom: 6em; }

@media (max-width: 960px) { .section-padding--x-large-bottom { padding-bottom: 3em; } }

@media (max-width: 650px) { .section-padding--x-large-bottom { padding-bottom: 1.5em; } }

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto; }

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

/*==============================================================
# COMPONENTS - Classes used globally for content
==============================================================*/
/*--------------------------------------------------------------
# Backgrounds
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Icons
--------------------------------------------------------------*/
.icon { position: relative; }

.icon--video, .icon--audio { fill: #99cc99; margin: 0 0.5em; position: absolute; top: 0; right: 0; bottom: 0; left: -45px; }

.icon--video:hover, .icon--video:active, .icon--video:focus, .icon--audio:hover, .icon--audio:active, .icon--audio:focus { fill: #fff; }

@media (max-width: 760px) { .icon { display: none; } }

/*--------------------------------------------------------------
# iFrames
--------------------------------------------------------------*/
.iframe-container { overflow: hidden; padding-top: 56.25%; position: relative; }

.iframe-container iframe { border: 0; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }

/*--------------------------------------------------------------
# Text
--------------------------------------------------------------*/
.title--basic { margin: 0.5em 0 0.5em; }

.title--bottom { margin: 0.5em 0 1.5em; }

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

.text--upper { text-transform: uppercase; }

.text--ellipsis { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.text--nowrap { white-space: nowrap; }

.link--plain { font-weight: normal; color: #fff; }

/*==============================================================
# PATTERNS - Classes used globally in specific areas
==============================================================*/
.logo { margin: 0 auto; text-align: center; }

.logo svg { fill: #fff; max-width: 100%; width: 1000px; max-height: 200px; }

.logo h1 { font-size: 18px; font-size: 1rem; margin: 0; line-height: 1.5; }

.social { text-align: center; }

.social__icon { display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; width: 50px; margin: 1.5em; max-height: 100px; }

.social__icon svg { fill: #fff; }

.social__icon svg:hover, .social__icon svg:active, .social__icon svg:focus { fill: #99cc99; }

@media (max-width: 550px) { .social__icon { margin: 1.5em 0.75em; width: 40px; } }

.album { border-bottom: 3px solid #888; display: flex; flex-wrap: nowrap; justify-content: space-between; margin: 3em auto; padding: 3em 0; }

.album:first-of-type { margin-top: 0; }

.album:last-of-type { border: none; }

.album__cover { width: 395px; }

.album__details { width: calc(95% - 395px); padding-left: 18px; }

.album__players { font-size: 16px; font-size: 0.8888888889rem; }

.album__info { font-size: 16px; font-size: 0.8888888889rem; }

.album h2 { margin-top: 0; }

@media (max-width: 760px) { .album { display: block; }
  .album__cover { margin-bottom: 1.5em; max-width: 100%; }
  .album__details { padding: 0; width: 100%; } }

.site-footer { padding: 3em 0 1.5em; }

.copyright { font-size: 14px; font-size: 0.7777777778rem; }

/*==============================================================
# SCOPES - Changes to classes for specific areas
==============================================================*/