/*
Theme Name: Emoto 2012
Theme URI: http://www.emotomusic.com/
Description: A theme for WordPress.
Author: Dave Funkhouser, Drew Baker, Funkhaus Design
Author URI: http://www.funkhaus.us
Version: 1.0


Colors:

    Dark Blue: #405764;
    Light Blue: #859196;
    Green: #919B12;
    Orange: #FC5424;
    Soundwell Yellow: #FECD69;
    Soundwell Blue: #61B3EE;
    
Fonts:

    font-family: 'Dosis', sans-serif;  
        Light 200
        Book 300
        Normal 400
        Medium 500
        Semi-Bold 600
        Bold 700
        Extra-Bold 800       

/*-------------------------------------------------------------- */


/*
 * Globals 
 */
    html {
        height: 100%;
    }
	body { 
        font-family: 'Dosis', sans-serif;    
	    font-size: 13px; 
	    color: #859196;
	    font-weight: 500;
	    height: 100%;
	    margin: 0;
	    padding: 0;
        letter-spacing: 1px;	    
	}
    ::selection {
        color: white;
        background: #405764;
    }
    ::-moz-selection {
        color: white;
        background: #405764;
    }	
    h1, h2, h3, h4, h5, h6 {
        font-weight: normal;
        line-height: 1;
        margin: 0;
        padding: 0;
    }
    

/* 
 * Links 
 */
	a { 
	    color: #405764; 
	    text-decoration: none;
	    outline: none;	    
	}
	a:hover { 
	    color: #FC5424;
	    text-decoration: underline;
	}
	a img {
	   border: none;
	}   
	.entry a {
        color: #919B12;
        text-decoration: underline;
	} 
	.entry a:hover {
        color: #FC5424;
	}

/* 
 * Page Structure 
 */
    #container {
        min-height: 100%;
        min-width: 1080px;
        padding: 0 60px;
        position: relative;        
    }
    #header {
        height: 51px;
        line-height: 25px;
        padding: 60px 0;
    }   
    #content .entry {
        line-height: 1.5;
        padding-bottom: 150px;
    } 


/* 
 * Menu's
 */
    #top-nav {
        font-weight: 600;   
        font-size: 14px; 
        list-style: none;
        float: right;
        text-transform: uppercase;
        height: 24px;
        line-height: 24px;
    }
    #top-nav li {
        float: left;
        margin-left: 30px;
        position: relative;
    }
    #top-nav a {
        color: #405764;
        text-decoration: none;   
    }
    /* Soundwell Item */
    #menu-item-14 {
        width: 100px;
        text-align: center;
    }
    /* 
     * Hover States
     */
        /* Default (Orange) */
        #top-nav .current-post-ancestor a,
        #top-nav .current-page-ancestor a,
        #top-nav .current-menu-item a,
        #top-nav a:hover {
    	    color: #FC5424;        
    	    position: static;
        }
        
    /*
     * Collapsed menu
     */
        #top-nav li {
            display: none;    
        }
        .home #top-nav li,
        #top-nav .current-page-ancestor,        
        #top-nav .current-post-ancestor,
        #top-nav .current-menu-item {
            display: block;
        }
        #top-nav .menu-toggle {
            color: #405764;
            display: block;
            cursor: pointer;
            width: 34px;
            text-align: center;
        }
        #top-nav .menu-toggle .svg {
            display: none;
        }
        #top-nav .menu-toggle.open {
            text-indent: -20000em;
        }
        #top-nav .menu-toggle.open .svg {
            display: block;
            float: right;
            margin: 7px 11px 0 0;
        }
        #top-nav .menu-toggle:hover,
        #top-nav .menu-toggle:hover path {
            color: #FC5424;
            fill: #FC5424;
        }
/*
 * Header
 */
    .logo {
        float: left;
    }
    #emoto-logo.logo:hover path,
    .logo:hover {
        text-decoration: none;
        fill: #405764;        
    }
    .logo img {
        display: none;
    }
    .share {
        border-left: 1px solid #CCCCCC;
        color: #405764;
        float: right;
        font-size: 12px;
        font-weight: 600;
        height: 26px;
        line-height: 23px;
        margin: 0 0 0 20px;
        padding: 0 0 0 20px;
        position: relative;
        text-transform: uppercase;
        top: 14px;
        cursor: pointer;
    }
    .share .svg {
        position: relative;
        top: 4px;
        margin: 0 5px 0 0;
    }
    .share:hover,
    .share:hover svg path {
        color: #FC5424;
        fill: #FC5424; 
    }    

        
/*
 * Home Page
 */
    .home #container {
        height: 550px;
    }
    #content.home {
        height: 540px;
        width: 1080px;
        position: absolute;
        top: 50%;
        left: 50%;
        margin: -300px 0 0 -540px;
    }
    .home-grid {
        height: 345px;
        overflow: hidden;
        margin: 90px 0 50px 0;
    }
    .home-block {
        height: 115px;
        width: 270px;
        float: left;
        text-decoration: none;        
    }
    .home-block img {
        transition: opacity 0.2s;
        -moz-transition: opacity 0.2s;
        -webkit-transition: opacity 0.2s;
        -o-transition: opacity 0.2s;            
    }
    .home-block h2 {
        position: absolute;
        top: 0;
        left: 0;
        line-height: 90px;
        height: 90px;
        font-size: 30px;
        font-weight: 300;
        color: #FC5424;
        opacity: 0;
        display: none;
        transition: opacity 0.2s;
        -moz-transition: opacity 0.2s;
        -webkit-transition: opacity 0.2s;
        -o-transition: opacity 0.2s;
    }
    .home-block:hover {
        text-decoration: none;
    }
    .not-mobile .home-grid:hover .home-block img,    
    .home-block.not-active img {
        opacity: 0.3;
    }
    .not-mobile .home-block:hover img,
    .home-block.active img {
        opacity: 1 !important;
    }
    .not-mobile .home-block:hover h2,
    .home-block.active h2 {
        display: block;
        opacity: 1;
    }


/*
 * Video Detail
 */
    .video-detail #container {
        height: 700px;
    }
    #content.video-detail > .page {
        position: absolute;
        top: 70px;
        left: 60px;
        right: 60px;
        bottom: 120px;
    }
    #content.video-detail .vvqbox {
        margin: 0;
        height: 450px;
        width: 800px;
        position: absolute;
        top: 50%;
        left: 50%;
        margin: -225px 0 0 -400px;
        background-color: black;
    }    
    #content.video-detail .title-wrapper {
        position: absolute;
        top: 0;
        width: 100%;
        display: none;
    }
    #content.video-detail .title {
        position: absolute;
        top: 50%;
        margin-top: -10px;
        width: 100%;
        text-align: center;        
        color: #FC5424;        
    }
    #content.video-detail .title span {
        color: #919B12;
    }    
    #content.video-detail #header {
        position: absolute;
        height: 120px;
        bottom: 0;
        left: 60px;
        right: 60px;
        line-height: normal;
        padding: 0;
    }
    /*
     * Thumb Tray
     */ 
        #video-thumb-tray-wrapper {
            width: 100%;
            position: absolute;
            top: 0;
            left: 0;
            overflow: hidden;
            height: 85px;
        }
        .video-thumb-tray {
            height: 70px;
            padding: 0 50px;
        } 
        .video-thumb-tray .slider {
	        width: 20000em;
        }
        .slider .video-thumb {
            height: 70px;
            width: 125px;
            transition: opacity 0.2s;
            -moz-transition: opacity 0.2s;
            -webkit-transition: opacity 0.2s;
            -o-transition: opacity 0.2s;    
            opacity: 0.2;   
            float: left;
        }
        .slider .video-thumb .meta {
            display: none;
        }
        .video-thumb-tray .browse {
            position: absolute;
            top: 0;
            width: 50px;
            height: 70px;
            text-align: center;
            cursor: pointer;
        }
        .video-thumb-tray .browse .svg {
            margin-top: 20px;        
        }
        .video-thumb-tray .prev {
            left: 0;
        }
        .video-thumb-tray .next {
            right: 0;
        } 
        .video-thumb-tray .browse.disabled {
            display: none !important;
        } 
        .video-thumb-tray .browse:hover svg path {
            fill: #FC5424;        
        }
        /* Hover State */
        .video-thumb-tray .slider:hover .video-thumb {
            opacity: 0.3;
        }
        .video-thumb-tray .slider .video-thumb.active,
        .video-thumb-tray .slider .video-thumb:hover {
            opacity: 1;
        }                
        
    /*
     * Soundwell Video Detail
     */
        body.soundwell {
            background-color: #274E6C;
        }
        .soundwell #content.video-detail .title {
            color: #FECD69;
        }
        .soundwell #content.video-detail .title span {
            color: #61B3EE
        }
        .soundwell #top-nav .menu-toggle path,
        .soundwell #top-nav .menu-toggle,
        .soundwell #top-nav a {
            color: #61B3EE;
            fill: #61B3EE;
        } 
        .soundwell #top-nav .menu-toggle:hover path,       
        .soundwell #top-nav .current-page-ancestor a,
        .soundwell #top-nav .menu-toggle:hover,        
        .soundwell #top-nav a:hover {
            color: #FECD69;
            fill: #FECD69;
        }
        .soundwell .share {
            color: #61B3EE;        
            border-left: 1px solid #61B3EE;
        }
        .soundwell .share svg path {
            fill: #61B3EE;
        }
        .soundwell .share:hover,               
        .soundwell .share:hover svg path {
            fill: #FECD69;
            color: #FECD69;         
        }
        .soundwell #soundwell-logo {
            color: #FECD69;
            text-transform: uppercase;
            text-align: center;
            font-size: 11px;
            font-weight: 600;
        }        
        .soundwell #soundwell-logo div {
            display: none;
            margin-top: 8px;
        }        
        .soundwell #soundwell-logo:hover div {
            display: block;
        }        
        .soundwell #emoto-logo {
            margin-left: 40px;   
            position: relative;
            top: 18px;    
        }
        .soundwell #emoto-logo svg {
            width: 110px;
        }
        .soundwell #emoto-logo path {
            fill: #BED4DD;
        }
        .soundwell #emoto-logo:hover path {
            fill: #FC5424;
        }
/*
 * Category (blog news)
 */
    #content.category {
        margin: 0 auto;
    }
    .blog-block {
        float: left;
        height: 200px;
        width: 270px;        
        position: relative;
    }
    .blog-block:hover {
        text-decoration: none;    
    }
    .blog-block img {
        position: absolute;
        top: 0;
        left: 0;
    }    
    .blog-block .overlay {
        display: table-cell;
        height: 200px;
        width: 230px;
        padding: 0 20px;
        color: white;
        font-weight: 600;
        font-size: 18px;
        text-align: center;
        position: relative;
        z-index: 10;
        vertical-align: middle;
        opacity: 0;
        background-color: #FC5424;
        transition: opacity 0.2s;
        -moz-transition: opacity 0.2s;
        -webkit-transition: opacity 0.2s;
        -o-transition: opacity 0.2s;        
    }
    .not-mobile .blog-block:hover .overlay,
    .blog-block.active .overlay {
        opacity: 1;    
    }    
    .blog-block .overlay div {
        font-size: 14px;
        margin: 5px 0;
    }

/*
 * Single
 */
    #content.single {
        width: 800px;
        margin: 0 auto;
    }
    .single .title {
        font-size: 32px;
        font-weight: 400;
        color: #405764;
        line-height: 1.5;
    }
    .single .post-meta {
        font-weight: 600;
        font-size: 14px;
        text-transform: uppercase;
        color: #919B12;
        margin: 0 0 1em 0;
    }
    .single .entry h2 {
        font-size: 16px;
        color: #405764;
    }
    .single .entry strong {
        font-weight: 700;
    }
    /*
     * Single gallery
     */
        .single .gallery {
            overflow: hidden;
        }
        .single .gallery-stage {
            height: 450px;
        }
        .single .gallery-stage .gallery-image {
            height: 100%;
            width: 100%;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
            cursor: pointer;
        }
        .single .gallery-stage img {
            display: none;
        }
        .single .gallery-thumbtray-wrapper {
            width: 805px;
        }
        .single .gallery .gallery-thumb {
            height: 100px;
            width: 130px;
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            float: left;
            cursor: pointer;
            margin: 4px 4px 0 0;
        }
        .single .gallery .gallery-thumb img {
            display: none;
        }

/*
 * About Page
 */
    .page-id-8 #container {
        height: 720px;
    }
    #content.about {
        height: 540px;
        width: 1080px;
        position: absolute;
        top: 50%;
        left: 50%;
        margin: -350px 0 0 -540px;
    }
    #content.about .entry {
        width: 1080px;
        text-align: justify;
    	padding-bottom: 0;   
    	overflow: hidden;   
    }
    #content.about .entry .col {
	    width: 530px;
	    float: left;
    }    
    #content.about .entry .col.right {
	    float: right;
    }    
    .about-grid {
        overflow: hidden;
        margin: 40px 0 50px 0;
    }
    .about-block {
        height: 115px;
        width: 270px;
        float: left;
        position: relative;
        overflow: hidden;
    }
    .about-block:hover {
        text-decoration: none;
    }
    .about-block img {
        position: absolute;
        top: 0;
        left: 0;
        transition: opacity 0.2s;
        -moz-transition: opacity 0.2s;
        -webkit-transition: opacity 0.2s;
        -o-transition: opacity 0.2s;            
    }
    .about-block h2 {
        background-color: rgba(252, 84, 36, 0.7);
        height: 115px;
        width: 270px;
        font-size: 22px;
        font-weight: 500;
        display: table-cell;
        vertical-align: middle;
        color: white;
        transition: opacity 0.2s;
        -moz-transition: opacity 0.2s;
        -webkit-transition: opacity 0.2s;
        -o-transition: opacity 0.2s;
        position: relative;
        z-index: 10;
        text-align: center;
        opacity: 0;
    } 
    .about-block h2 span {
        font-size: 14px;
        text-transform: uppercase;
        font-weight: 600;
        display: block;
        margin: 5px 0;
    }
    .not-mobile .about-block:hover h2,    
    .about-block.active h2 {
        opacity: 1;
    }
    .about-block.heading-block {
        background-color: #405764;    
    }
    .about-block.heading-block h2 {
        background: none;
        opacity: 1;
        padding: 0 0 0 15px;
        text-align: left;
        vertical-align: bottom;
        text-transform: uppercase;
        font-size: 18px;
        font-weight: 600;
        letter-spacing: 1px;
        height: 100px;
    }

/*
 * About Detail
 */
    #content.about-detail {
        width: 800px;
        margin: 0 auto;
    }
    #header .title {
        float: left;
        font-size: 26px;
        height: 51px;
        line-height: 51px;
        font-weight: 300;
        color: #405764;
    }
    #header .title span.sep {
        color: #919B12;
        margin: 0 15px;
    }
    #header .title span.sep.large {
        font-size: 38px;
    }
    #header .title span.name {
        position: relative;
        top: -13px;
    }
    #header .title span.credit {
        text-transform: uppercase;
        font-size: 14px;
        line-height: 14px;
        font-weight: 500;
        display: block;
        margin-left: 58px;
        color: #FC5424;
        position: relative;
        top: -23px;
    }
    ul.questions {
        margin: 0;
        padding: 0;
        list-style: none;
        overflow: hidden;
    }
    ul.questions li {
        margin: 0;
        padding: 0;
        float: left;
        width: 50%;
    }
    .questions h3 {
        text-transform: uppercase;
        color: #919B12;
        font-size: 14px;
        font-weight: 600;  
        margin-bottom: 5px;  
    }
    .questions p {
        margin: 0 0 1em 0;
    }
    /*
     * About video gallery
     */
        .video-gallery {
            height: 510px;
            width: 800px;
            border-bottom: 1px solid #999999;
        }
        .video-gallery .gallery-stage {
            height: 510px;
            width: 800px;
            overflow: hidden;
        }
        .video-gallery .gallery-stage .items {
            position: relative;
            width: 20000em;
            height: 510px;
        }        
        .video-gallery .gallery-item {
            float: left;
        }
        .video-gallery .video-stage-image,
        .video-gallery .gallery-item {
            height: 450px;
            width: 800px;
            background-repeat: no-repeat;
            background-position: top center;
        }
        .video-gallery .gallery-video {
            background-color: black;
        }
        .video-gallery .gallery-image img {
            display: none;
        }
        .video-gallery .title {
            height: 60px;
            width: 100%;
            line-height: 60px;
            text-align: center;
            font-size: 16px;
            font-weight: 300;
            color: #FC5424;
            position: absolute;
            bottom: -60px;
        }
        .video-gallery .title span {
            color: #919B12;
        }        
        .video-gallery .navigation .browse {
            top: 400px;
        }
        .video-gallery .play-icon {
            height: 79px;
            width: 79px;
            position: relative;
            top: 50%;
            left: 50%;
            margin: -40px 0 0 -40px;
            cursor: pointer;
        }
        .video-gallery .vvqbox {
            margin: 0;
        }
        .video-gallery .browse.disabled,
        .browse-not-needed .navigation {
            display: none;
        }
    /*
     * Team Page Gallery Overrides
     */
        .parent-pageid-40 .gallery {
            height: 450px;
            border-bottom: none;
        }
    /*
     * Soundwell About Page Override
     */        
        #soundwell-banner {
            position: relative;
            top: -20px;
        }
        .page-id-212 #emoto-logo {
            top: 2px;
        }
        .soundwell .about-detail {
            color: #FECD69;
        }
        .soundwell .video-gallery .title {
            border-bottom: 1px solid #FECD69;
            color: #FECD69;            
        }
        .soundwell .video-gallery .title span {
            color: #61B3EE;
        }
        .soundwell .about-detail a {
            color: #61B3EE;
        }
        .soundwell .about-detail a:hover {
            color: #FC5424;
        }

/*
 * Private Reel
 */
 	.private-reel #emoto-logo {
	 	position: relative;
	 	top: 16px;
	 	margin-right: 30px;
 	}
 	.private-reel #soundwell-logo path {
	 	fill: #274E6C;
 	}
 	.private-reel #soundwell-logo:hover path {
	 	fill: #FECD69;
 	} 	

/*
 * Contact Page
 */
    .page-id-10 #container {
        height: 650px;
    }
    #content.contact {
        height: 520px;
        width: 1080px;
        position: absolute;
        top: 50%;
        left: 50%;
        margin: -310px 0 0 -540px;
    }
    #content.contact .entry {
        padding: 0;
    }
    .contact .entry ul {
        margin: 0;
        padding: 0;
        list-style: none;
        overflow: hidden;
        font-weight: 500;
    }
    .contact .entry ul li {
        width: 260px;
        float: left;
        padding-left: 35px;
    }
    .contact .entry ul li:first-child {
        padding-left: 0;
    }
    .contact li.staff {
        background: url(images/background-staff.svg) no-repeat 0 5px;
        margin-left: 80px;
    }
    .contact li.sales {
        background: url(images/background-sales.svg) no-repeat 0 5px;
        margin-left: 50px;
    }    
    .contact .entry a {
        font-weight: 600;
        text-decoration: none;
        color: #405764;
    }
    .contact .entry a:hover {
        text-decoration: none;
    }
    .contact .entry a.map {    
        text-transform: uppercase;
    }
    .contact .entry a.map svg {
        position: relative;
        top: 2px;
    }    
    .contact .entry a:hover,
    .contact .entry a:hover path {
        fill: #405764;
        color: #FC5424;
    }
    .contact-grid {
        height: 230px;
        width: 100%;
        margin: 50px 0 60px;
    }
    .contact-grid .contact-block {
        float: left;
        line-height: 0;
    }
/*
 * Page/Post Navigation
 */ 
 
    .navigation .browse,
    .navigation a {
        height: 90px;
        width: 40px;
        position: absolute;
        top: 50%;
        margin-top: -45px;
        background-color: #CCC;
        text-align: center;
        line-height: 110px;
        cursor: pointer;
    }
    .single .navigation a {
        top: 460px;
    }
    .navigation img {
        display: none;
    }
    .navigation .left,
    .navigation .prev a {
        left: 0;
        border-radius: 0 3px 3px 0;        
    }
    .navigation .right,
    .navigation .next a {
        right: 0;
        border-radius: 3px 0 0 3px;
    }
    .navigation svg path {
        fill: white;
    }
    .navigation .browse:hover svg path,
    .navigation a:hover svg path {
        fill: #FC5424;
    }
    /* Soundwell color option */
    .soundwell .navigation .browse,
    .soundwell .navigation a {
        background-color: #61B3EE;
    }
    .soundwell .navigation .browse svg path,
    .soundwell .navigation svg path {
        fill: #405764;
    }
    .soundwell .navigation .browse:hover svg path,
    .soundwell .navigation a:hover svg path {
        fill: #FECD69;
    }


/*
 * Tools 
 */
    .post-edit-link {
        font-size: 10px;
        text-transform: uppercase;
    }
    #tagline {
        display: none;
    }
	/* Fix share this from showing scroll bars on load */
	#stwrapper {
		position: absolute;
	}
    #funk-badge {
        background-image: url("images/icon-funk-badge.png");
        background-repeat: no-repeat;
        height: 14px;
        width: 69px;
    }
    #funk-badge:hover {
        background-position: 0 -20px;
    }        
    #funk-badge span {
        display: none;
    }


/*
 * Wordpress Required 
 */
	.alignleft { 
	    display: inline; 
	    float: left;
	}
	.aligncenter { 
	    clear: both; 
	    display: block; 
	    margin: 0 auto 10px auto; 
	}
	.alignright { 
	    display: inline; 
	    float: right;
	}
	img.alignleft { 
	    margin: 0 10px 10px 0;
	}
	img.alignright { 
	    margin: 0 0 10px 10px;
	}
	img.aligncenter { 
	    margin: 0 auto 10px auto;
	}
	
	.wp-caption { 
	    background: #f1f1f1; 
	    color: #888; 
	    text-align: center; 
	    margin-bottom: 15px; 
	    width: auto !important;
	    -moz-border-radius: 0 0 4px 4px;
	    border-radius: 0 0 4px 4px;
	}
	.wp-caption img { 
	    margin: 0px;
	}
	.wp-caption p.wp-caption-text { 
	    margin: 0 0 5px; 
	    padding: 4px; 
	    font-style: italic;
	}