/*
Theme Name: Volcano
Author: Kevin Gojmerac
Description: Theme for the 2014 Wordpress build of the Volcano website.
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: volcano
*/



/* FONTS */

@font-face {
    font-family: 'Haettenschweiler';
    src: url('font/haettenschweiler.eot');
    src: url('font/haettenschweiler.eot?#iefix') format('embedded-opentype'), url('font/haettenschweiler.svg#Haettenschweiler') format('svg'), url('font/haettenschweiler.woff') format('woff'), url('font/haettenschweiler.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}



/* FOUNDATION OVERRIDES */

.row {
    max-width: 80rem;   /* 1200px at base 16px */
}

html {
    background: #000;
    z-index: 0;
}

body {
    background: #000 !important;
    color: #e3e3e3;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 0.8em;
    letter-spacing: 0.1em;
    line-height: 1.4em;
    height: auto;
    display: block;
    z-index: 1;
}

.breadcrumbs {
    border: none;
    border-radius: 0;
}

nav .breadcrumbs {
    padding-bottom: 0;
}

.breadcrumbs>* {
    font-size: 0.8rem;
}

.breadcrumbs>*:before {
    content: "|";
    color: #fff;
    top: -1px;
}



/* WORDPRESS OVERRIDES */

.wp-caption {
    max-width: 100%;
}

.wp-caption-text {
    font-style: italic;
}



/* TEXT */

h1, h2, h3, h4, h5, h6 {
    color: #e3e3e3;
    font-weight: 300;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    letter-spacing: 0.1em;
}

p, li, footer a {
    font-size: 0.8rem;
    line-height: 1.4;
}

a {
    color:#FFFF99;
    text-decoration:none;
}

a:hover,
a:focus {
    color:#FFCC33;
    text-decoration: none;
    outline: none;
}

.gold {
    color: #ffcc33;
}

.dark.gold {
    color: #cb9800;
}

.title {
    font-family: 'Pathway Gothic One', Impact, sans-serif;
    letter-spacing: 0.15em;
    text-shadow: 1px 1px #000;
}

.gold.title {
    border-bottom: 2px solid #ffcc33;
    text-transform: uppercase;
}

*:focus {
    outline: none;
}



/* HEADER, NAVIGATION, MENUS */

header {
    padding-top: 2em;
}

#logo {
    display: inline-block;
    width: 204px;
    height: 80px;
    background: url('imgs/volcano_logo.png') no-repeat 0 -80px;
    margin-left: 0.9375rem;
}

#logo.active,
#logo:hover,
#logo:focus {
    background-position: 0 -80px;
    cursor: default;
}

#menuToggle {
    position: absolute;
    right: 16px;
    top: 43px;
    font-size: 3em;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    display: none;
}

nav ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

nav ul li {
    display: inline-block;
}

nav ul li:last-child {
    margin-right: 0 !important;
}

#mainMenu {
    margin: 1em 0;
    padding: 0;
    list-style: none;
}

#mainMenu li {
    line-height: 1;
    margin: 0 1em 0.5em 0;
}

#mainMenu li a {
    font-family: 'Pathway Gothic One', Impact, sans-serif;
    color: #e3e3e3;
    font-size: 2em;
    text-transform: uppercase;
    text-shadow: 1px 1px #000;
}

#mainMenu li a:hover,
#mainMenu li a:focus {
    color: #fff;
}

#subMenu nav {
    padding: 0;
}

#subMenu li,
#subMenu li a {
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    margin-bottom: 0.5rem;
}

#subMenu li.current-menu-item a,
#subMenu li a:hover,
#subMenu li a:focus {
    color: #000;
    text-decoration: none;
}

/* Default submenu */
#pageMenu {
    background: #cc0000;
}




/* LAYOUT */


#notchedSpacer {
    margin-top: 0.5em;
    height: 30px;
    position: relative;
    overflow: hidden;
    background: url('imgs/notched_spacer.png') right top;
}

.shaded,
#content {
    background-image: url('imgs/bg_tile.png');
}

#content {
    padding-bottom: 2em;
}

section img {
    border: 1px solid #fff;
}

img.noborder {
    border: none !important;
}

.width100 {
    width: 100%;
}

footer {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    margin: 0.5em auto 3em !important;
}

#footerContent {
}

#footerContent a {
    margin-left: 1em;
}

#footerContent a:first-child {
    margin-left: 0;
}

#footerContent a.textLink {
    position: relative;
    top: 1em;
}

#footerContent i {
    font-size: 2.5em;
}



/* HOME */

#eruptingNow {
    background: #980000;
    margin-top: 0.5em;
}

/*
#eruptingNow li {
    text-align: center;
}
*/

#eruptingNow img {
    display: block;
    width: 100%;
    max-width: 250px;
    margin: 0 auto 1em;
}



/* COMPANY */

#companyMenu {
    background: #7eca1f;
}



/* PRODUCTIONS */

#productionsMenu {
    background: #cc0000;
}

article .breadcrumbs {
    background: transparent;
    margin-bottom: 0;
    padding-left: 0;
}

article .breadcrumbs>*:before {
    color: #FFCC33;
}

article .breadcrumbs li {
    margin-bottom: 1em;
}

article .breadcrumbs a {
    color:#FFFF99;
    text-transform: none;
    font-size: 0.8rem;
}

article .breadcrumbs a:hover,
article .breadcrumbs a:focus {
    color:#FFCC33;
    text-decoration: none;
}

article .breadcrumbs li:hover a,
article .breadcrumbs li:focus a {
    text-decoration: none;
}

article .breadcrumbs li:first-child>*:before {
    content: "|";
    color: #FFCC33;
    margin: 0 0.75rem 0 0;
    position: relative;
    top: -1px;
}

article.production .content .row {
    margin-bottom: 1rem;
}

#productionSidebar {
    padding: 1em 2em 3em 2em;
}

#productionSidebar .widgettitle {
    text-transform: uppercase;
    margin-bottom: 0.5em;
}

#productionSidebar ul {
    list-style: none;
    margin-left: 0;
}

#productionSidebar ul li {
    margin-bottom: 0.5em;
    position: relative;
    padding-left: 1em;
}

#productionSidebar ul li a {
    text-transform: uppercase;
}

#productionSidebar ul li a:before {
    content: "- ";
    position: absolute;
    left: 0;
}


/* TOURING */

#touringMenu {
    background: #cc0000;
}

.touringEntry {
    text-align: center !important;
}

.touringEntry .tourTitle {
    color: #ffcc33;
    font-weight: 600;
    text-transform: uppercase;
}

.touringEntry img {
    margin-bottom: 1em;
    width: 100%;
    max-width: 200px;
}


/* EDUCATION */

#educationMenu {
    background: #0066cb;
}


/* SUPPORT */

#supportMenu {
    background: #fd6600;
}


/* LINKS */

#linksMenu {
    background: #cb9800;
}



/* CONTACT */

#contactMenu {
    background: #980066;
}



/* GALLERIA */

#galleria img {
    border: none !important;
}

.galleria-theme-classic {
}


/* MEDIA QUERIES */

/* Small screens */
@media only screen { } /* Define mobile styles */

/* max-width 640px, mobile-only styles, use when QAing mobile issues */
@media only screen and (max-width: 40em) {

    #menuToggle {
        display: block;
    }

    #mainMenu {
        background-image: url('imgs/bg_tile.png');
        padding: 0.5em 0;
        display: none;
    }

    #mainMenu.expanded {
        display: block;
    }

    #mainMenu li {
        display: block;
        text-align: center;
        line-height: 1.4;
        margin: 0;
    }

    #productionSidebar {
        padding: 0em 1em 0 1em;
    }

} 

/* Medium screens */
@media only screen and (min-width: 40.063em) { } /* min-width 641px, medium screens */

@media only screen and (min-width: 40.063em) and (max-width: 64em) { } /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */

/* Large screens */
/* min-width 1025px, large screens */
@media only screen and (min-width: 64.063em) {
    #logo {
        display: inline-block;
        width: 255px;
        height: 100px;
        background: url('imgs/volcano_logo_lg.png') no-repeat 0 -100px;
        margin-left: 0.9375rem;
    }

    #logo.active,
    #logo:hover,
    #logo:focus {
        background-position: 0 -100px;
    }
} 

@media only screen and (min-width: 64.063em) and (max-width: 90em) { } /* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */

/* XLarge screens */
@media only screen and (min-width: 90.063em) { } /* min-width 1441px, xlarge screens */

@media only screen and (min-width: 90.063em) and (max-width: 120em) { } /* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */

/* XXLarge screens */
@media only screen and (min-width: 120.063em) { } /* min-width 1921px, xxlarge screens */

