/*
Theme Name: Biscuit 2015
Description: A theme for Biscuit website
Author: Dave Funkhouser, Drew Baker, Funkhaus
Author URI: http://www.funkhaus.us
Version: 1.0

Fonts:
    font-family: HelveticaNeueLT-Bold, sans-serif;
        font-weight: 400;
        font-weight: 500;

Colors:
    Black: #222222;

/*-------------------------------------------------------------- */
/**
 * Table of Contents
 *
 * 1.0 - Global styles
 * 2.0 - Style for index page
 * 3.0 - Style for person page
 * 4.0 - Style for contact page
 * 5.0 - Style for index blog page
 * 6.0 - Style for blog item page
 * 7.0 - Color Scheme for UK site
 *
 */



/**
 * 1.0 - Global
 *
 * This styles is used to set the font size of body, background color, anchor color
 * and other styles used by all pages
 */
    * {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-tap-highlight-color: transparent;
        -webkit-text-size-adjust: none;
    }

    body {
        font-family: 'HelveticaNeueLT-Bold', sans-serif;
        -webkit-font-smoothing: antialiased;
        font-size: 14px;
        background-color: #EDE8D3;
        margin: 0;
    }

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

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        margin: 0;
        padding: 0;
        line-height: 1;
        font-weight: normal;
    }

    img {
        border: 0;
    }

    button,
    html input[type="button"],
    input[type="reset"],
    input[type="submit"] {
        -webkit-appearance: button;
        /* 2 */

        cursor: pointer;
        /* 3 */
    }

    button,
    select {
        text-transform: none;
    }

    button {
        overflow: visible;
    }

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

    ::selection {
        color: #222;
        background: #92aaaa;
    }

    ::-moz-selection {
        color: #222;
        background: #92aaaa;
    }



/*
 * Links
 */

    a {
        text-decoration: none;
    }

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

    a:hover {
        text-decoration: underline;
    }

    #container {
        max-width: 1400px;
        margin: 0 auto;
        height: 100%;
        position: relative;
        padding: 0 60px;
        padding-bottom: 50px;
    }



/*
 * Header
 */
    #header {
        color: #12142D;
        padding-top: 50px;
        position: relative;
        z-index: 110;
        overflow: hidden
    }
    .logo path {
        fill: #12142D;
    }
    .logo:hover path {
        fill: #953527;
    }
    #header h1 {
        font-size: 90px;
        line-height: 85px;
        text-indent: -6px;
    }
    .main-menu {
        list-style: none;
        margin: 0;
        padding: 0;
        margin-top: 5px;
    }
    .main-menu li {
        float: left;
        margin: 0 13px 0 0;
    }
    .main-menu .current-menu-item {
        display: none;
    }
    .main-menu a {
        color: #12142D;
        font-size: 25px;
    }
    .main-menu a:hover {
        text-decoration: none;
        color: #953527;
    }

    /* Hover on SVG logo */
    .logo:hover > svg * {
        fill: #953527;
    }
    .contact .logo:hover > svg * {
        fill: #363533;
    }
    .contact.UK-colours .logo:hover * {
        fill: #953527;
    }
    .blog-page .main-menu a:hover {
        color: #953527;
    }
    .contact .main-menu a:hover {
        color: #363533;
    }
    .contact.UK-colours .main-menu a:hover {
        color: #953527;
    }

    /* Region picker */
    .region-picker {
        font-size: 18px;
        position: absolute;
        top: 50px;
        right: 0;
    }
    .region-picker span {
        opacity: 0.5;
    }
    .region-picker span.region {
        cursor: pointer;
    }
    .region-picker span.active,
    .region-picker span.region:hover {
        opacity: 1;
    }

/*
 * Directors Menus (home page)
 */

    .director-block {
        position: relative;
        z-index: 120;
        margin: 80px 0;
    }
    .background-image.cycle-slide-active {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }
    .director-block ul {
        margin: 0;
        padding: 0;
        list-style: none;
        width: 100%;
        font-size: 0;
    }
    .directors-menu .space-above {
        margin-top: 1.2em;
    }
    .director-block .column {
        display: inline-block;
        vertical-align: top;
        width: 50%;
        margin-right: 15px;
    }
    .director-block .column:last-child {
        width: calc(50% - 15px);
        margin-right: 0;
    }
    .director-block li {
        font-size: 41px;
        display: block;
    }
    .director-block a {
        white-space: nowrap;
        color: #953527;
        z-index: 110;
        position: relative;
        display: inline-block;
    }
    .director-block ul li a:hover {
        text-decoration: none;
    }
    .director-block .sub-menu {
        display: none;
        font-size: 0;
    }

/*
 * Background slideshows (used on homepage and categories)
 */
    #background-wrapper {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 10;
    }
    #background-wrapper .background-image {
        width: 100%;
        height: 100%;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        background-position: center;
    }
    #background-wrapper .overlay {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(51, 51, 45, 0.75);
    }
    #background-wrapper img {
        display: none;
    }





/**
 * 3.0 - Style for person page
 * This is styles for Director page
 */
    .person-page {
        position: relative;
        padding-bottom: 30%;
    }
    .person-page h2 {
        font-size: 154px;
        margin: 0;
        color: #953527;
        line-height: 1.2;
        margin-top: 30px;
    }
    .person-page .person-videos {
        padding-right: 10%;
        overflow: hidden;
    }
    .video-block {
        background-color: #333;
        position: relative;
        margin-bottom: 25px;
        overflow: hidden;
    }
    .person-page .video-block:last-child {
        margin-bottom: 0;
    }
    .video-block .background-image {
        background-size: cover;
        background-position: center center;
        -webkit-filter: grayscale(100%);
        filter: grayscale(100%);
        z-index: 10;
        cursor: pointer;
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
    }
    .video-block .background-image .second-image {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        z-index: 11;
        background-size: cover;
        background-position: center center;
        opacity: 0;
    }
    .video-block:hover .background-image {
        -webkit-filter: grayscale(0);
        filter: grayscale(0);
    }
    .video-block:hover .background-image .second-image {
        opacity: 1;
    }
    .video-block > img {
        visibility: hidden;
        display: block;
        width: 100%;
        height: auto;
    }
    .video-block > iframe {
        display: none;
    }
    .video-block .fluid-width-video-wrapper {
        display: none;
        background-color: black;
    }
    .video-block .person-name {
        position: absolute;
        color: #ede8d3;
        font-size: 52px;
        bottom: 20px;
        left: 40px;
        z-index: 30;
    }
    .video-block .person-name .line-2 {
        display: none;
    }
    .video-block .play-button {
        position: absolute;
        color: #ede8d3;
        font-size: 52px;
        bottom: 20px;
        left: 40px;
        text-transform: uppercase;
        text-decoration: none;
        display: none;
        cursor: pointer;
        z-index: 30;
        line-height: 1;
    }

    /* Hover state */
    .video-block:hover {
        opacity: 1;
    }
    .video-block:hover .background-image {
        -webkit-filter: grayscale(0);
        filter: grayscale(0);
    }

    /* Hidden at client request May 8th, 2017
    .video-block:hover h3 {
        display: none;
    }
    .not-mobile .video-block:hover .play-button {
        display: block;
    }
    */

    /* Playing state */
    .video-block.playing {
        background-color: black;
    }
    .video-block.playing:hover .play-button,
    .video-block.playing h3,
    .video-block.playing .play-button {
        display: none;
    }

    /* Inactive state */
    .video-block.inactive {
        opacity: 0.2;
    }
    .video-block.inactive h3,
    .video-block.playing .play-button {
        display: none;
    }
    .video-block.inactive:hover {
        opacity: 1;
    }

    /* Body Content (External link) */
    .person-page .info {
        position: relative;
        overflow: hidden;
        margin-right: 10%;
        margin-top: 20px;
        font-size: 24px;
    }
    .person-page .entry {
        float: left;
    }
    .person-page .entry p {
        margin: 0;
    }
    .person-page .info a {
        color: #1e1b2a;
    }
    .person-page .info a:hover {
        color: #92AAAA;
        text-decoration: none;
    }
    .person-page .sales-reps {
        float: right;
    }

    /* Number/Title Bar */
    .number-nav {
        position: fixed;
        right: 40px;
        bottom: 30px;
        font-size: 42px;
        padding: 0;
        margin: 0;
        list-style: none;
        text-align: right;
    }
    .number-nav li {
        color: #BFC9BE;
        display: block;
        cursor: pointer;
    }
    .number-nav li:hover {
        text-decoration: none;
        color: #92AAAA;
    }
    .number-nav .name {
        display: none;
    }
    .number-nav .name .line-2 {
        display: none;
    }
    .number-nav .active {
        color: #92AAAA;
    }




/**
 * 4.0 - Style for contact page
 * This is styles for contact page
 */

    body.contact {
        background: #92AAAA;
        height: initial;
    }
    .contact #header {
        color: #953527;
    }
    .contact .logo path {
        fill: #953527;
    }
    .contact .main-menu a {
        color: #953527;
    }
    #content.contact-page {
        color: #953527;
        font-size: 25px;
        margin-top: 50px;
    }
    #content .contact-person {
        border-top: 4px solid #ffffff;
        padding-top: 40px;
        color: #ffffff;
    }
    #content .contact-person a,
    .contact-page .social a {
        color: #ffffff;
    }
    .contact-page > div {
        margin-bottom: 40px;
    }
    .contact-page a {
        color: #953527;
    }
    .contact-page p {
        margin: 0;
    }
    .contact-page ul {
        margin: 0;
        padding: 0;
        list-style: none;
        overflow: hidden;
    }
    .contact-page .row {
        overflow: hidden;
    }
    .contact-page .row .contact-grid-30,
    .contact-page .row .contact-grid-60,
    .contact-page .row .contact-grid-40 {
        padding-right: 30px;
        width: 33%;
        float: left;
    }
    .contact-page .row .contact-grid-60 {
        width: 66%;
    }
    .contact-page .row .contact-grid-30 {
        position: relative;
    }
    .contact-location ul {
        margin-right: -15px;
        margin-left: -15px;
        overflow: hidden;
    }
    .contact-location li {
        padding-right: 15px;
        padding-left: 15px;
        width: 33.3%;
        float: left;
    }
    .contact-location h4 {
        font-size: 150px;
        text-indent: -10px;
        line-height: 190px;
    }
    .contact-location address {
        font-style: normal;
        margin-bottom: 40px;
    }
    .contact-person li p:first-child:hover {
        text-decoration: underline;
    }
    .contact-location address:hover {
        text-decoration: underline;
    }
    .contact-person h4,
    .contact-sales h4 {
        font-size: 120px;
        text-indent: -5px;
    }
    .contact-sales h4 {
        margin-bottom: 20px;
    }
    .contact-person li {
        margin: 20px 0;
    }
    .sales-contact {
        margin: 30px 0;
    }
    .contact-sales address {
        font-style: normal;
        margin-bottom: 40px;
    }
    .contact-bottom h4 {
        margin-bottom: 10px;
    }
    .contact-bottom form {
        width: 100%;
    }
    .contact-bottom input {
        background-color: #953527;
        border: 0;
        padding: 15px 23px;
        width: 70%;
        color: #92AAAA;
    }
    .contact-bottom input:focus {
        border: 0;
    }
    .contact-bottom input::-webkit-input-placeholder,
    .contact-bottom input:-moz-placeholder,
    .contact-bottom input::-moz-placeholder,
    .contact-bottom input:-ms-input-placeholder {
        color: #92AAAA;
    }
    .contact-bottom button {
        font-size: 30px;
        background: transparent;
        border: 0;
    }
    .contact-bottom .social {
        line-height: 37px;
        margin-top: 30px;
    }

/**
 * 4.5 - Style for sales page
 */
    body.sales {
        background: #92AAAA;
    }
    .sales .main-menu a,
    .sales #header {
        color: #953527;
    }
    .sales .logo path {
        fill: #953527;
    }
    .sales-page {
        margin-top: 50px;
        font-size: 25px;
        color: #953527;
    }
    .sales-page ul {
        list-style-type: none;
        padding: 0;
        margin: 0;
    }
    .sales-page h4 {
        font-size: 150px;
        text-indent: -10px;
        line-height: 190px;
    }
    .sales-page .entry ul {
        display: -webkit-flex;
        display: flex;
    }
    .sales-page .entry a {
        color: #953527;
    }
    .sales-page .sales-block {
        margin-bottom: 2em;
        flex: 1 1 auto;
    }
    .sales-page .sales-block:last-child {
        flex: initial;
    }
    .sales-page .sales-block .contacts {
        margin-top: 1.6em;
    }

    .UK-colours.sales .logo path {
        fill: #12142D;
    }
    .UK-colours .sales-page .entry a,
    .UK-colours.sales .main-menu a,
    .UK-colours.sales #header,
    .UK-colours .sales-page {
        color: #12142D;
    }

/*
 * 5.0 - Style for blog index page
 */

    body.blog-page {
        background: #363533;
        height: initial;
    }
    .blog-page #header {
        color: #92AAAA;
    }
    .blog-page .logo path {
        fill: #92AAAA;
    }
    .blog-page .main-menu a {
        color: #92AAAA;
    }
    .blog-index {
        color: #92AAAA;
        font-size: 25px;
        margin-top: 20px;
        position: relative;
        z-index: 20;
    }
    .blog-block {
        cursor: pointer;
        width: 32.3%;
        padding: 20px 30px 40px 0;
        display: inline-block;
        vertical-align: top;
        color: #92AAAA;
        font-size: 20px;
    }
    .blog-block:hover {
        text-decoration: none;
    }
    .blog-block h4 {
        font-size: 56px;
        margin-bottom: 5px;
    }
    .blog-block .title {
        margin: 0;
        line-height: 1.4;
        font-size: 20px;
    }
    .blog-block .title span {
        display: block;
    }





/*
 * 6.0 - Style for blog item post
 */

    #content.blog-item {
        color: #92AAAA;
        padding: 30px 0;
        position: relative;
    }
    .blog-item #header {
        color: #92AAAA;
    }
    .blog-item a {
        color: #92AAAA;
    }
    .blog-item .title {
        font-size: 60px;
        line-height: 1;
        padding-right: 150px;
        position: relative;
        margin-bottom: 40px;
        width: 100%;
        overflow: hidden;
        color: #92AAAA;
    }
    .blog-item .title span {
        display: block;
    }
    .blog-item .title .line-1 {
        font-size: 140px;
        margin-bottom: 20px;
        word-wrap: break-word;
    }
    .blog-item .entry {
        text-align: justify;
        font-size: 20px;
    }
    .blog-item .entry .alignnone {
        max-width: 100%;
        height: auto;
    }
    .blog-item .entry .alignnone:first-child {
        margin: 0 0 25px 0;
    }
    .blog-item .entry p {
        padding-right: 35%;
    }
    .blog-item .entry .contains-iframe {
        padding-right: 0;
    }
    .blog-item .entry a {
        text-decoration: underline;
    }
    .blog-item .entry a:hover {
        color: #ede8d3;
    }

    /* Video Block */
    .blog-item .video-block .play-button {
        color: #92AAAA;
        display: block;
    }
    .blog-item .video-block.playing .play-button {
        display: none;
    }

    /* Heading number & share links */
    .blog-item .heading-right-side {
        text-align: right;
        position: absolute;
        right: 0;
        top: 27px;
    }
    .blog-item .heading-right-side .social-media-sharing {
        list-style: none;
        margin: 0;
        font-size: 26px;
    }
    .blog-item .heading-right-side .date {
        font-size: 70px;
    }

    /* Pagination */
    .blog-item .pagination {
        font-size: 52px;
        margin-top: 40px;
        line-height: 1;
    }
    .blog-item .pagination a {
        margin: 0 0 0 20px;
        display: inline-block;
        height: 52px;
    }
    .blog-item .pagination svg {
        display: inline-block;
        vertical-align: middle;
        position: relative;
        top: -2px;
    }
    .blog-item .pagination a:hover polygon,
    .blog-item .pagination a:hover rect {
        fill: #ede8d3;
    }




/**
 * 7.0 Color scheme for UK site
 * class UK-colours must be initiated on body tag.
 */
    /* Header & menu */
    .UK-colours .logo path {
        fill: #953527;
    }
    .UK-colours .main-menu a {
        color: #953527;
    }
    .UK-colours .main-menu a:hover {
        color: #12142D;
    }
    .UK-colours #header {
        color: #953527;
    }

    /* Person page (Director page) */
    .UK-colours .person-page h2 {
        color: #12142D;
    }
    .UK-colours .director-block a {
        color: #12142D;
    }

    /* Contact page */
    .UK-colours.contact #header {
        color: #12142D;
    }
    .UK-colours.contact .logo path {
        fill: #12142D;
    }
    .UK-colours.contact .main-menu a {
        color: #12142D;
    }
    .UK-colours #content.contact-page {
        color: #12142D;
    }
    .UK-colours .contact-page a {
        color: #12142D;
    }
    .UK-colours .contact-page .social a {
        color: #ffffff;
    }
    .UK-colours .contact-bottom input {
        background-color: #12142D;
    }

    /* Blog pages */
    .UK-colours.blog-page #header,
    .UK-colours.blog-item #header {
        color: #953527;
    }

/*
 * When a director name is hovered, js adds a class to the body named "add-bg"
 */
	.add-bg {
		background-color: #272723;
	}
	.add-bg #header .logo path {
		fill: #EDE8D3;
	}
	.add-bg.blog-page #header .logo path {
		fill: #92AAAA;
	}
	.add-bg.blog-page.UK-colours #header .logo path {
		fill: #953527;
	}
	.add-bg.blog-page #header a {
		color: #92AAAA;
	}
	.add-bg.blog-page.UK-colours #header a {
		color: #953527;
	}
	.add-bg #header,
	.add-bg #header a {
		color: #EDE8D3;
	}
	.add-bg .director-block li a {
		color: rgba(237, 232, 211, 0.3);
	}
	.add-bg .director-block li.active > a {
		color: #ede8d3;
	}
	.add-bg .blog-block {
		color: rgba(146, 170, 170, 0.3);
	}
	.add-bg .blog-block:hover {
		color: #92AAAA;
	}
	.category.add-bg #header {
		color: #92aaaa;
	}


/*
 * Animations
 */
    /* Color */
    a {
        -webkit-transition: opacity 0.4s;
        transition: color 0.4s;
    }

    /* Opacity */
    .region-picker span,
    .browse {
        -webkit-transition: opacity 0.4s;
        transition: opacity 0.4s;
    }

    /* Everything */
    svg path {
        -webkit-transition: opacity 0.4s;
        transition: 0.4s;
    }

    /* Custom */
    body {
        -webkit-transition: background-color 0.4s ease;
        transition: background-color 0.4s ease;
    }
    .person-page .person-videos .item .overlay {
        -webkit-transition: opacity 0.4s ease;
        -moz-transition: opacity 0.4s ease;
        -o-transition: opacity 0.4s ease;
        transition: opacity 0.4s ease;
    }
    #background-wrapper .background-image {
		-webkit-transition: -webkit-transform 10s;
		transition: transform 10s;
    }
    .video-block {
		-webkit-transition: opacity 0.4s;
		transition: opacity 0.4s;
    }
    .video-block .background-image {
		-webkit-transition: -webkit-transform 10s, -webkit-filter 1s;
		transition: transform 10s, filter 1s;
    }
    .video-block .background-image .second-image {
		-webkit-transition: opacity 10s;
		transition: opacity 10s;
    }

/*
* Wordpress Required
*/
    .alignleft {
        display: block;
        margin: 2em 0;
    }
    .aligncenter {
        clear: both;
        display: block;
        margin: 2em auto;
    }
    .alignright {
        display: inline;
        float: right;
    }
    .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;
    }