/*
Theme Name:		WP Framework
Theme URI: 		http://wpframework.com/
Version: 		0.2.4.10
Description: 	A <em>blank</em> WordPress Theme Framework <strong>that's everything you need, and nothing you don't.</strong> With features like <em>microformats, a traditional template structure, convention over configuration, clean semantic code, documenation, and it's atomic templating system</em>, WP Framework is <em>completely extensible, flexible</em> and <strong><em>the</em></strong> starting point for theme authoring and customization. To learn more, visit <a href="http://wpframework.com">http://wpframework.com</a>.
Author: 		Ptah Dunbar
Author URI:		http://ptahdunbar.com
Tags:			one-column, two-columns, three-columns, fixed-width, sticky-post, threaded-comments, microformats

Copyright 2008 Ptah Dunbar <http://ptahdunbar.com> All rights reserved.
WP Framework is licensed under the terms of the GNU General Public License version 2.

If you have any questions, comments, or concerns, 
visit <http://wpframework.com> for more information!
*/

/* Reset Browser Defaults */
@import url( 'library/media/css/reset.css' );

/* Apply base theme styles and colors */
@import url( 'library/media/css/base.css' );

/* Basic 2 Column Layout */
@import url( 'library/media/layouts/2col-r.css' );

/* Stylistic CSS Styles */
@import url( 'library/media/css/screen.css' );

/* Museo */
@import url( 'library/media/css/museo/stylesheet.css' );

/* ************************************************* */
/* Mobilizr - this bit makes the site work on mobile */
.left > a {
    display: none;
}

#mobilehomefeature {
    display: none;
}

@media screen and ( max-width: 768px )
{
    /* Nav box stuff */
    .nav, .nav * {
        font-size: 46px;
        line-height: 48px;
    }
    .left {
        width: 450px;
    }

    .container {
        width: 200px;
        /*height: 1500px;*/
    }

    body.home {
        background-color: white;
    }

    /* Background picture thingy with the 4x4 headshots */
    #homefeature {
        left: -960px;
        /*top: 500px;*/
        min-height: auto;
        top: 150px;
        display: none;        
    }
    #text-4 {
        left: -680px;        
    }

    /* Fabrik - Pure Hair text thing */
    #titlecopy {
        display: none;
    }
    #mobilehomefeature {
        display: block;
        width: 400px;
    }

    .menu span:after {
        width: 0;
        height: 0;
        border: 0.313em solid transparent;
        border-bottom: none;
        border-top-color: #efa585;
        content: '';
        vertical-align: middle;
        display: inline-block;
        position: relative;
        right: -0.313em;
    }

    .menu > ul > li {
        height: 100%;
        width: 100%;
        background-color: #ccc;
        border-bottom: 1px solid #eee;
    }

    .menu > ul > li:hover {        
        border-bottom: 1px solid #fff;
        background-color: #ddd;
    }

    .menu > ul {
        height: 3.75em;
        /*background-color: #ccc;*/
    }    

    /*.menu > ul > li:hover > a,
    .menu > ul:not( :hover ) > li.active > a {
        background-color: #cc470d;
    }*/

    .left {
        position: relative;
        top: auto;
        left: auto;
        /*width: 1280px;*/
    }
    .left > a {
        width: 1.12em;
        height: 1.125em;
        text-align: left;
        font-weight: bolder;
        font-size: 4em;
        text-align: center;
        /*text-indent: -9999px;*/
        background-color: #666;
        position: relative;
    }
    /*.left > a:before,
    .left > a:after {
        position: absolute;
        border: 2px solid #fff;
        top: 35%;
        left: 25%;
        right: 25%;
        content: '';
    }*/
    .left > a:after {
        top: 60%;
    }
    .left:not( :target ) > a:first-of-type,
    .left:target > a:last-of-type {
        display: block;
    }

    .left > div > ul {
        height: auto;
        display: none;
        position: absolute;
        left: 0;
        right: 0;
    }
    .left:target > div > ul {
        display: block;
        z-index: 9999;
    }

    
    /* Make the news posts easier to read on mobile */
    .postcopy {
        font-size: 26px;
    }
    /* Hide the archives links on mobile */
    #archives-2 {
        display: none;
    }
    #categories-2 {
        display: none;
    }

    /* Make the other content easier to read on mobile */
    .article {
        font-size: 24px;
    }

    /* Re-arrange the gallery */
    .ngg-imagebrowser {
        /*position: relative !important;*/
        position: absolute !important;
        left: 140px !important;
        top: 270px !important;
        /*border: 1px solid red;*/
        width: 360px !important;
    }
    #albumnav {
        /*position: relative;
        float: left;*/
        position: absolute;
        left: 10px;
        top: 420px;
        font-size: 18px;
    }
    #next {
        position: absolute !important;
        left: -40px !important;
        top: 0px !important;
        background-color: #444;
    }
    #back {
        position: absolute !important;
        left: -40px !important;
        top: 68px !important;
        background-color: #444;
    }
    /*.ngg-browser-prev {        
        outline: 1px solid red;
    }*/
    .ngg-browser-prev > img {
        width: 34px;
        height: 66px;
    }
    .ngg-browser-next > img {
        width: 34px;
        height: 66px;
    }
    .pic > a > img {
        width: auto !important;
        height: auto !important;
        display: block !important;
        max-width: 300px;
        max-height: 424px;
    }
    .gallerytext {
        margin-top: 470px !important;
        display: inline-block;
    }
    /*#post-12 {
        min-height: 550px;
    }*/

    /* Make expo text easier to read */
    .middletext {
        font-size: 24px;        
    }
    /*.middle {
        width: 360px;
        float: none;
        padding-bottom: 80px;
    }*/
    .middle {
        width: 360px;        
        padding-bottom: 80px;
        position: relative;
        top: 80px;
        left: -20px;
        /* outline: 1px solid red; */
    }
    /*#aboutfeature {
        left: 450px;
        top: 100px;
    }*/

    /*#feature-about {
        left: 0px;
        top: 0px;
        position: absolute;
        outline: 1px solid red;
    }*/

    #logo {
        display: none;
    }

    .feature-about {
        position: relative !important;
        left: 0px !important;
    }

    .feature-team {
        position: absolute !important;
        left: 415px !important;
        top: 530px !important;
    }

    .feature-edu {
        position: relative !important;
        left: 0px !important;
        /*top: 500px !important;*/
    }

    /*.aside-team {
        outline 1px solid red;
        position: relative;
        width: auto;
    }*/    

    /* *{   
        outline: 1px solid red;        
    } */
}
/* End Mobilizr */
/* ************************************************* */

/* These empty css selectors are temporarily here for compatiability with the WordPress theme repository checklist. */
.aligncenter {} .alignleft {} .alignright {} .wp-caption {} .wp-caption-text {}