:root {
    --white: #fff;
    --grey: #333333;
    --off-white: #e1e1e1;
    --primary: #2b2b2b;
    --secondary: #889299;

    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -ms-overflow-style: scrollbar;
    -webkit-tap-highlight-color: transparent;
}

@-ms-viewport {
    width: device-width;
}

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

body {
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.5;
    color: var(--off-white);
    text-align: left;
    background-color: var(--grey);
    -webkit-font-smoothing: antialiased;
}

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

h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: 0;
}

p {
    margin-top: 0;
    margin-bottom: 0.7rem;
}

br {
    line-height: 1.5rem;
}

a {
	color: var(--off-white);
    text-decoration: underline;
    -webkit-text-decoration-skip: objects;
}

a:hover {
    color: #ff007b !important;
}

a:not([href]):not([tabindex]) {
    color: #ff007b !important;
}

a:not([href]):not([tabindex]):hover, a:not([href]):not([tabindex]):focus {
    color: #ff007b !important;
    text-decoration: none;
}

a:not([href]):not([tabindex]):focus {
    color: #ff007b !important;
    text-decoration: none;
}

.titles {
	font-family: 'Inconsolata', sans-serif;	
	font-size: 2rem;
}

.titles a {
	text-decoration: none;
}


.hyperlinks {
    font-weight: 700;
    color: var(--primary);
    -webkit-text-decoration-skip: objects;
    text-decoration: none;
    border-bottom: 1px solid var(--primary);
}

.hyperlinks:hover {
    font-weight: 700;
    color: var(--ivory);
    background-color: var(--primary);
    text-decoration: none;
}
@media (max-width: 768px) {
    .hyperlinks:hover {
        color: var(--primary);
        background-color: transparent;
    }
}

/*
img {
    vertical-align: middle;
    border-style: none;
    box-shadow: 3px 3px 6px #eeeeee;
}
*/


.img-fluid {
    max-width: 98%;
}

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

caption {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    color: #6c757d;
    text-align: left;
    caption-side: bottom;
}

legend {
    display: block;
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin-bottom: .5rem;
    font-size: 1.5rem;
    line-height: inherit;
    color: inherit;
    ivory-space: normal;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: inherit;
    font-weight: 500;
    line-height: 1.3;
    color: inherit;
}

h1, .h1 {
    font-size: 2rem;
    font-weight: 700;
    mso-ansi-font-weight: 700;
    mso-bidi-font-weight: 700;
}

h2, .h2 {
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 700;
    mso-ansi-font-weight: 700;
    mso-bidi-font-weight: 700;
}

h3, .h3 {
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 700;
    mso-ansi-font-weight: 700;
    mso-bidi-font-weight: 700;
}

h4, .h4 {
    font-size: 1.5rem;
}

h5, .h5 {
    font-size: 1rem;
    color: var(--primary);
    line-height: 1.5rem;
}

h6, .h6 {
    font-size: 1rem;
    color: var(--secondary);
    line-height: 1.5rem;
}

.h7 {
    display: block;
    font-size: 0.975rem;
    color: var(--secondary);
    line-height: 1.5rem;
}


canvas {
    position: fixed;
    display:block;
    top: 0;
    left: 0;
    max-width: 100%;
    max-height: 100%;
    margin: 0 auto;
    z-index:-1;
}


.row {
    margin-left: 0px;
    margin-right: 0px;
}


.iframe__video {
    min-height:350px;
    max-height:100%;
    width:100%;
}



.mt-6,
.mx-6 {
    margin-top: 6rem;
}

.mr-6 {
    margin-right: 6rem;
}


.mb-6,
.my-6 {
    margin-bottom: 6rem !important;
}

.pb-6 {
    padding-bottom: 6rem !important;
}

/*
h2.title {
    padding-bottom: 1.5rem;
}
*/


.fixed-top {
    top: 0px;
    right: 16px;
    left: 16px;
}


.container-fluid {
    width: 100%;
    padding-right: 32px;
    padding-left: 32px;
    margin-right: auto;
    margin-left: auto;
}
@media (max-width: 768px) {
    .container-fluid {
        padding-right: 16px;
        padding-left: 16px;
    }
}

.title__project {
    padding-top: 120px;
    padding-bottom: 1rem;
}
@media (max-width: 768px) {
    .title__project {
        padding-top: 32px;
        padding-bottom: 1rem;
    }
}

.title__page--home {
    padding-top: 120px;
    padding-bottom: 40px;
}
@media (max-width: 768px) {
    .title__page--home {
        padding-top: 120px;
        padding-bottom: 40px;
    }
}


.title__section {
    padding-top: 20px;
    padding-bottom: 20px;
}

.btn__buy {
    padding: 0 0.125rem;
    font-weight: 700;
    color: var(--ivory);
    background-color: var(--yellow);
    text-decoration: none;
}

.btn__listen {
    padding: 0 0.125rem;
    font-weight: 700;
    color: var(--primary);
    background-color: var(--blue);
    text-decoration: none;
}

/*
.dates__home {
    padding: 0.2rem 0;
    color: var(--primary);
    background-color: var(--yellow);
    text-decoration: none;
}
*/
.strike {
    text-decoration: line-through;
}


/* * * * * * * * * * * * * * * * * * * * * *

    F O O T E R

* * * * * * * * * * * * * * * * * * * * * * */

footer {
	background-color: var(--off-white);
	color: var(--primary);
	font-weight: 600;
}

#mc_embed_signup {
	clear:left; 
	font:14px "Lucida Sans Unicode", "Lucida Grande", sans-serif;  
	width: 100%;
}

#mc_embed_signup form {
	display: block; 
	position: relative; 
	text-align: left; 
	padding: 0px 0px 0px 0px;
}

#mc_embed_signup .button {
	clear:both; 
	background-color: #333333; 
	border: 0 none; 
	border-radius:0px; 
	color: #FFFFFF; 
	cursor: pointer; 
	display: inline-block; 
	font-size:14px; 
	font-weight: bold; 
	height: 32px; 
	line-height: 32px; 
	margin: 0 5px 10px 0; 
	padding:0; 
	text-align: center; 
	text-decoration: none; 
	vertical-align: top; 
	white-space: nowrap; 
	width: 70%;
}

#mc_embed_signup .button:hover {
	background-color: #ff007b; 
}

#mc_embed_signup input.email {
    display: block;
    padding: 8px 0;
    margin: 0 4% 10px 0;
    text-indent: 5px;
    width: 70%;
    min-width: 130px;
}