/************* GENERAL STYLES ***/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-family: inherit;
	vertical-align: baseline; }

:focus { outline: 0; }

* { box-sizing: border-box; }

body {
    background: #fff;
	font-family: 'Playfair Display', serif;
	font-size: 20px;
	line-height: 1.8;
	color: black; }

ul { list-style: none; }

ul.list {
	list-style: disc;
	padding: 0 0 16px 15px; }

ol { padding: 0 0 16px 15px; }
	
	ul.list li, ol { margin: 0 0 5px; }

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0; }

caption, th, td {
	text-align: left;
	font-weight: normal; }

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

blockquote, q { quotes: "" ""; }

strong { font-weight: bold; }

h1 { 
    margin-bottom: 20px;
	font-size: 50px; 
	font-weight: normal;
	color: black;
    line-height: normal;
    text-align: center; }

h2 {
    margin-bottom: 30px;
	font-size: 35px; 
	font-weight: normal;
	color: #black;
    line-height: normal; }

a:link, a:visited { 
	color: #b6a37b;
	text-decoration: none;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease; }
	
a:hover { color: black; }

p { margin-bottom: 1.5em; }

/************* STRUCTURE STYLES ***/
.wrapper {
	width: 1010px;
    max-width: 100%;
    padding: 0 25px;
	margin: 0 auto; }


/*** NAV ***/
nav {
    width: 100%;
    height: 86px;
    float: left;
    position: fixed;
    z-index: 999;
    padding: 5px 0;
    background: white;
    font-family: 'the_dead_saloonregular';
    font-size: 20px;
    text-align: center;
    line-height: normal;
    letter-spacing: 1px;
    box-shadow: 0 0 10px #000; }

    nav .wrap {
        width: 100%;
        height: 100%;
        float: left;
        padding: 25px 0;
        border: 1px solid #000;
        border-left: 0;
        border-right: 0; }

    nav ul {
        -webkit-transition: all 0.5s ease;
        transition: all 0.5s ease; }

        nav ul.open { 
            height: auto;
            padding: 30px 0;
            opacity: 1; }

        nav ul li { 
            display: inline;
            padding: 0 19px 0 0;
            margin: 0 15px 0 0;
            background: url(../images/divider.png) center right no-repeat; }

            nav ul li:last-child {
                padding: 0;
                margin: 0;
                background: none; }

        nav a:link, nav a:visited { color: black; }

            nav a:hover, nav a.active {
                color: black;
                text-decoration: none; }

        nav a.mobile {
            width: 35px;
            display: none;
            margin: 0 auto; }

            nav a.mobile span {
                height: 4px;
                display: block;
                margin: 0 0 6px;
                background: white; }


/*** HEADER ***/
header {
    width: 100%;
    height: 600px;
    float: left;
    margin: 86px 0 0;
    position: relative;
    background: url(../images/header_bg.png) center bottom no-repeat #000;
    text-align: center; }

    header.bio { background: url(../images/news_bg.jpg) center top no-repeat #000; }
    header.events { background: url(../images/events_bg.jpg) center top no-repeat #000; }
    header.music { background: url(../images/music_bg.jpg) center top no-repeat #000; }
    header.contact { background: url(../images/contact_bg.jpg) center top no-repeat #000; }

    header img {
        position: absolute;
        bottom: -48px;
        left: 50%;
        margin-left: -300px; }

    header .title {
        position: absolute;
        bottom: 50px;
        left: 0;
        right: 0; }

        header .title span {
            width: 100px;
            display: inline-block;
            border-bottom: 3px solid #b6a37b; }


/*** SECTION ***/
section {
    width: 100%;
    float: left;
    padding: 0 0 80px; }

.shadow { background: url(../images/shadow.png) top repeat-x; }

article {
    width: 100%;
    max-width: 800px;
    margin: 0 auto; }


/*** HOME VIDEO ***/
section#home_video { padding: 80px 0 0; }

    section#home_video .text {
        padding: 50px 0 75px;
        background: url(../images/blood.png) center bottom no-repeat;
        text-align: center;
        line-height: normal; }

        section#home_video .text p { margin-bottom: 2em; }

        section#home_video .text i { color: black; }

        section#home_video .text span {
            display: block;
            margin: 10px 0 0;
            font-size: 40px;
            color: black; }

        section#home_video .text a {
            padding-bottom: 7px;
            border-bottom: 3px solid #b6a37b;
            font-size: 22px; }

            section#home_video .text a:hover { 
                color: black;
                border-color: black;
                text-decoration: none; }


/*** HOME VIDEO ***/
section#home_news {
    padding: 450px 0 0;
    background: url(../images/news_bg.jpg) top center no-repeat #000; }

    section#home_news ul {
        width: 100%;
        float: left; }

        section#home_news ul li {
            width: 16.66667%;
            float: left;
            padding: 15px;
            background: white;
            color: black; }

            section#home_news ul li:nth-child(even) { background: white; }

            section#home_news ul li div {
                height: 250px;
                display: block;
                position: relative;
                border: 1px solid #b6a37b; }

                section#home_news ul li div span.date {
                    position: absolute;
                    top: 20px;
                    left: 20px;
                    font-size: 50px;
                    line-height: normal; }

                    section#home_news ul li div span.date small {
                        display: block;
                        font-size: 20px; }

                section#home_news ul li div a {
                    display: block;
                    position: absolute;
                    bottom: 20px;
                    left: 20px;
                    right: 20px;
                    font-size: 22px;
                    line-height: 1.5; }


/*** VIDEO WRAPPER ***/
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 25px;
	height: 0; }

    .videoWrapper iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%; }


/*** NEWS ***/
#news ul li {
    width: 100%;
    float: left;
    padding: 20px;
    margin: 0 0 20px;
    border: 1px solid #b6a37b; }

    #news ul li span.date { 
        width: 100px;
        float: left;
        margin: 0 20px 0 0;
        font-size: 30px;
        line-height: normal; }

        #news ul li span.date small { 
            display: block;
            font-size: 1em;
            font-size: 18px; }

        #news ul li div.news_div {
            min-height: 50px;
            display: block;
            padding: 0 0 0 20px;
            border-left: 1px solid #b6a37b;
            overflow: hidden;
            line-height: 1.5; }


/*** MUSIC ***/
#music figure {
    width: 60%;
    float: left;
    margin: 0;
    position: relative; }

    #music figure .overlay {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 100;
        background: url(../images/icon_bandcamp@2x.png) center no-repeat rgba(0,0,0,0.7);
        opacity: 0;
        -webkit-transition: all 0.2s linear;
        transition: all 0.2s linear; }

        #music figure .overlay:hover { opacity: 1; }

    #music figure img.album {
        width: 100%;
        max-width: 100%;
        height: auto;
        float: left; }

#music > div {
    width: 40%;
    float: left;
    padding: 30px 0 0 30px; }

#music h2 {
    padding: 0 0 25px;
    margin: 0 0 25px;
    border-bottom: 3px solid #b6a37b; }

#music ol { padding-bottom: 50px; }

    #music ol span { 
        margin: 0 10px 0 0;
        color: black; }


/*** CONTACT ***/
#contact ul li {
    width: 100%;
    float: left;
    margin: 0 0 40px;
    line-height: normal; }

#contact label { 
    display: block;
    margin: 0 0 7px;
    font-size: 16px; }

#contact .text, #contact textarea {
    width: 100%;
    background: none;
    border: 0;
    border-bottom: 1px solid #858585;
    font: inherit;
    color: black; }

#contact textarea { height: 100px; }

#contact .submit {
    width: 300px;
    max-width: 100%;
    display: block;
    padding: 10px;
    margin: 0 auto;
    text-align: center;
    background: #071e5d;
    border: 0;
    font: inherit;
    font-size: 16px;
    color: white;
    cursor: pointer;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear; }

    #contact .submit:hover {
        background: #071e5d;
        color: white; }


/*** FOOTER ***/
footer {
    width: 100%;
    height: 158px;
    float: left;
    padding-top: 65px;
    background: url(../images/footer_bg.png) bottom left no-repeat #000;
    color: #ababab;
    font-size: 18px;
    line-height: normal; }

    footer p { 
        float: left;
        margin: 5px 0 0; }

        footer p span { color: black; }

    footer .right { float: right; }

        footer .right img {
            float: left;
            margin-left: 10px;
            opacity: 0.5;
            -webkit-transition: all 0.2s ease;
            transition: all 0.2s ease; }

            footer .right img:hover { opacity: 1; }

            footer .right img.trackie { margin-left: 20px; }
	
	
/*** MEDIA QUERIES ***/
@-ms-viewport { width: device-width; }
@viewport { width: device-width; }


/*** RETINA ***/
@media all and (-webkit-min-device-pixel-ratio: 1.5) {

    body { 
        background: white;
        background-size: 512px; }
    
    nav ul li { 
        background: url(../images/divider@2x.png) center right no-repeat;
        background-size: 4px; }
    
    header {
        background: url(../images/header_bg@2x.png) center bottom no-repeat #000;
        background-size: 1440px; }

    header.bio, section#home_news { 
        background: url(../images/news_bg@2x.jpg) center top no-repeat #000;
        background-size: 1440px; }
    
    
    .shadow { 
        background: url(../images/shadow@2x.png) top repeat-x;
        background-size: 50px; }

    section#home_video .text {
        background: url(../images/blood@2x.png) center bottom no-repeat;
        background-size: 488px; }
    
    footer {
        background: url(../images/footer_bg@2x.png) bottom left no-repeat #000;
        background-size: 519px; }
    
}


/*** 1440px ***/
@media all and (max-width: 1440px) {

    section#home_news ul li { width: 20%; }
    
        section#home_news ul li:nth-child(n+6) { display: none; }
    
}


/*** 1280px ***/
@media all and (max-width: 1280px) {

    section#home_news ul li { width: 25%; }
    
        section#home_news ul li:nth-child(n+5) { display: none; }
    
}


/*** 900px ***/
@media all and (max-width: 900px) {
    
    header {
        height: 550px;
        background-image: url(../images/header_bg_900.png); }
    
        header img { 
            width: 500px;
            margin-left: -250px; }
    
    section#home_news { padding-top: 0; }

    section#home_news ul li { width: 33.33337%; }
    
        section#home_news ul li { display: block !important; }
    
            section#home_news ul li div span.date { font-size: 40px; }

                section#home_news ul li div span.date small { font-size: 18px; }

            section#home_news ul li div a { font-size: 20px; }
    
}


/*** RETINA 900px ***/
@media all and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 900px) {
    
    header {
        background-image: url(../images/header_bg_900@2x.png);
        background-size: 900px; }
    
}


/*** 800px ***/
@media all and (max-width: 800px) {
    
    #music figure, #music > div { 
        width: 100%;
        text-align: center; }
    
    #music > div { padding-left: 0; }
    
}


/*** 750px ***/
@media all and (max-width: 750px) {

    section#home_news ul li { width: 50%; }
    
        section#home_news ul li:nth-child(3) { background: #380908; }
        section#home_news ul li:nth-child(4) { background: #470f0e; }
    
        section#home_news ul li div { height: 200px; }
    
}


/*** 700px ***/
@media all and (max-width: 700px) {
    
    nav { height: 70px; }
    
        nav .wrap { padding: 15px 0 0; }
    
        nav a.mobile { display: block; }
    
        nav ul {
            width: 100%;
            height: 0;
            position: absolute;
            top: 100%;
            left: 0;
            z-index: 1;
            padding: 0;
            background: #141213;
            box-shadow: 0 0 10px #000;
            overflow: hidden;
            opacity: 0; }

            nav ul li { 
                display: block;
                padding: 0;
                margin: 0 0 15px;
                background: none; }
    
    header {
        height: 456px;
        margin-top: 70px;
        background-image: url(../images/header_bg_700.png); }
    
    section#home_video .text span { font-size: 30px; }
    
    footer { 
        height: auto;
        padding: 65px 0;
        text-align: center;
        font-size: 16px; }
    
        footer p, footer .right { width: 100%; }

        footer p { margin: 0 0 20px; }
    
        footer .right img {
            float: none;
            margin: 0 5px !important;
            display: inline-block; }
    
}


/*** RETINA 700px ***/
@media all and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 700px) {
    
    header {
        background-image: url(../images/header_bg_700@2x.png);
        background-size: 700px; }
    
}


/*** 600px ***/
@media all and (max-width: 600px) {
    
    header img { 
        width: 400px;
        bottom: 0;
        margin-left: -200px; }
    
    section#home_video { padding-top: 20px; }
    
    section#home_news ul li { 
        width: 100%;
        background: #470f0e !important; }
    
        section#home_news ul li:nth-child(even) { background: #380908 !important; }
    
        section#home_news ul li div { 
            width: 100%;
            height: auto;
            float: left;
            padding: 20px; }

            section#home_news ul li div span.date { 
                width: 100px;
                position: static; 
                float: left;
                margin: 0 20px 0 0; }

            section#home_news ul li div a {
                min-height: 60px;
                display: block;
                position: static;
                padding: 0 0 0 20px;
                border-left: 1px solid #b6a37b;
                font-size: 18px;
                overflow: hidden; }
    
}


/*** 450px ***/
@media all and (max-width: 450px) {
    
    body { font-size: 16px; }
    
    header { background-image: url(../images/header_bg_450.png); }
    
        header img { 
            width: 290px;
            margin-left: -145px; }
    
    section#home_news ul li div span.date, #news ul li div span.date { 
        width: 100%;
        font-size: 30px; }

        section#home_news ul li div span.date small, #news ul li span.date small { 
            display: inline;
            margin: 0 0 0 5px;
            font-size: 14px; }
    
    section#home_news ul li div a, #news ul li div a {
        width: 100%;
        float: left;
        padding: 10px 0 0;
        border: 0; }
    
}


/*** RETINA 450px ***/
@media all and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 450px) {
    
    header {
        background-image: url(../images/header_bg_450@2x.png);
        background-size: 450px; }
    
}