/*
Theme Name: ISO web
Theme URI: http://isodesign.co.uk
Description: ISO WordPress Theme 2012
Version: 0.9
Author: Andrew Hopkins
Updated: 08th Nov 2012
*/

@import "style/css/reset.css";
@import "style/css/typography.css";

body{
background: #FFFFFF;
}

#ovr{
position: absolute;
left: 0;
top: 50px;
opacity: 0.3;
}


header{
position: fixed;
top: 0; /* c */
background: #FFFFFF;
z-index: 1000;
height: 88px;
width: 1240px;
margin-left: 15px;
border-bottom: 1px solid #CCCCCC;
}

header.no-border{
border: 0 none;
}

#logo{
float: left;
width: 304px;
height: 28px;
background: url('http://isodesign.co.uk/wp-content/themes/WEW_base/images/logo.png') no-repeat 0 0 scroll transparent;
display: block;
margin-top: 10px;
}

#logo:hover{
background-position:bottom left;
}

nav.main{
float:left;
margin-left: 8px;
width: 780px;
margin-top: 6px;
}

nav.sub{
position: fixed;
background: #FFFFFF;
z-index: 999;
height: 88px;
width: 1240px;
/* padding-top: 4px; */
margin-left: 15px;
margin-top: 89px;
opacity: 1;
transition: opacity .4s ease-in-out;
-moz-transition: opacity .4s ease-in-out;
-webkit-transition: opacity .4s ease-in-out;
-o-transition: opacity .4s ease-in-out;
}

nav.sub.fade-out{
opacity: 0;
}

nav.detached{
position: relative;
top: auto;
margin-top: 0;
border-top: 1px solid #CCCCCC;
padding-top: 4px;
z-index: 1000;
background: #FFFFFF;
height:84px;
width: 1240px;
}

nav.fixed{
top: 0;
position: fixed;
margin-top: 88px;
}

nav ul{
float:left;
width: 148px;
height: auto;
overflow: hidden;
margin-right: 8px;
}


#header-search{
display:none;
border-bottom: 1px dotted #666666;
overflow: visible;
height: 14px;
padding-bottom: 2px;
margin-top: 2px;
}

#s{
float:left;
width: 90%;
height: 19px;
background: transparent;
border: 0 none;
padding-left: 2px;
margin-top: -2px;
}

#searchsubmit{
float:right;
padding-top: 1px;
}

.share-menu{
width: 80px;
height: 80px;
margin-top: 6px;
}

.share-menu ul{
display: none;
}


.social-menu{
margin-top: -3px;
}

#social-links{
margin-top: 7px;
}



#main{
width: 1240px;
margin-top: 90px;
padding-left:15px;
overflow: hidden;
float: left;
}

#main.double-header{
margin-top: 177px; /* margin-top: 181px; */
}

/* home */
.home-archives{
padding-left: 15px;
padding-top: 8px;
background: #FFFFFF;
position: absolute;
z-index:1000;
overflow: hidden;
width: 1240px;
bottom: 0;
height: 30px;
}

.home-archives div{
border-top: 1px solid #CCCCCC;
padding-top: 8px;
line-height: 14px;
}
/* - */

/* home carousels */
.carousel{
overflow: hidden;
height: 100%;
}

ul.slides{
position: relative;
}

.slides li{
padding-bottom: 8px;
}

.slides li a{
position: relative;
}

.slide-media img{
width: 100%;
}


.slide-info{
position: absolute;
top: 0;
left: 0;
z-index: 10;
width: 100%;
height: 100%;
background: #333333;
opacity: 0;
transition: opacity .3s ease-in-out;
-moz-transition: opacity .3s ease-in-out;
-webkit-transition: opacity .3s ease-in-out;
-o-transition: opacity .3s ease-in-out;
}

.slide-info-news{
background-color: #F4F4F4;
transition: background-color .3s ease-in-out;
-moz-transition: background-color .3s ease-in-out;
-webkit-transition: background-color .3s ease-in-out;
-o-transition: background-color .3s ease-in-out;
height: 304px;
}

.col-two .slide-info h2,
.col-two .slide-info h4{
padding-left: 6px;
padding-right: 50%; /* 120px; */
}

.col-one .slide-info h2,
.col-one .slide-info h4,
.col-one .slide-info-news h2,
.col-one .slide-info-news h4{
padding-left: 6px;
padding-right: 60px;
}

.slides li a:hover .slide-info,
.slide-info.hovered{
opacity: 0.9;
}

/* news panel colors */
.slide-info-news .slide-cat,
.slide-info-news .slide-date,
.slide-info-news .slide-title,
.slide-info-news .slide-desc{
transition: color .3s ease-in-out;
-moz-transition: color .3s ease-in-out;
-webkit-transition: color .3s ease-in-out;
-o-transition: color .3s ease-in-out;
}

.slide-info-news .slide-cat{
color: #333333;
}
.slide-info-news .slide-date,
.slide-info-news .slide-title{
color: #666666;
}
.slide-info-news .slide-desc{
color: #999999;
}

/* news panel hover colors */
.slides li a:hover .slide-info-news,
.slide-info-news.hovered{
background-color: #333333; /* #EBEBEB; */
opacity: 0.9;
}

.slides li a:hover .slide-info-news .slide-cat,
.slides li a:hover .slide-info-news .slide-date,
.slide-info-news.hovered .slide-cat,
.slide-info-news.hovered .slide-date{
color: #FFFFFF;
}

.slides li a:hover .slide-info-news .slide-title,
.slide-info-news.hovered .slide-title{
color: #FFFFFF;
}
.slides li a:hover .slide-info-news .slide-desc,
.slide-info-news.hovered .slide-desc{
color: #CCCCCC;
}
/* - */


/* featured-work */
#featured-work > li,
#project-content > li{
overflow: hidden;
padding-bottom: 8px;
}

.info-col{
border-top: 1px solid #CCCCCC;
width: 286px;
padding: 8px 16px 0 2px;
}

#project-content .info-col{
border: 0 none;
}

#project-content .project-section .info-col,
.bigtext, .credits, .two-cols, .four-cols{
border-top: 1px solid #CCCCCC;
}
/* - */

#project-content .image-caption .info-col{
border-top: 1px solid #E9E9E9;
}

.media-col{
position: relative;
}

.media-col iframe,
.media-col object,
.media-col html,
.media-col img{
width: 100%;
/* height: auto; */
}

.media-col img{
height: auto;
}

.media-col .play-button{
    cursor: pointer;
    width: 44px;
    height: 66px;
    position:absolute;
    top: 50%;
    left: 50%;
    margin: -33px 0 0 -22px;
}

.hand:hover{
cursor: pointer;
}

/* single project */
#project-content{

}

.bigtext{
width: 556px;
padding-top: 6px;
padding-right: 372px;
padding-bottom: 30px;
/* padding-bottom: 75px; */
}

.credits{
padding-top: 6px;
padding-bottom: 82px;
}

#project-content .credits ul{
margin-bottom: 19px;
}

#project-content .credits li{
padding: 0;
}

.project-section-text img{
width: 100%;
height: auto;
}

#project-content>li:last-child{
padding-bottom: 0;
border-bottom: 8px solid #FFFF00;
}

#project-content.profile>li:last-child{
border-bottom: 0 none;
}
/* - */



/* profile */
.two-cols, .four-cols{
width: 624px;
padding-right: 304px;
padding-top: 6px;
padding-bottom: 45px;
}


#project-content ul.profile-menu li{ 
font-size: 14px;
line-height: 19px;
padding-bottom: 0;
}

#project-content ul.profile-menu li a{
/* line-height: 22px; */
}

/* - */

/* projects archive */
#project-grid{
width: 1248px; /* +8px overhang margin */
}

.projects{
overflow: hidden;
}

.projects li{
height:  303px;
width: 304px;
float:left;
margin-right: 8px;
}

.projects a{
display: block;
/* height: 279px; */
height: auto;
padding-bottom: 8px;
width:100%;
}


.projects a{
border-bottom: 1px solid #FFFFFF;
transition: border-bottom .4s ease-in-out;
-moz-transition: border-bottom .4s ease-in-out;
-webkit-transition: border-bottom .4s ease-in-out;
-o-transition: border-bottom .4s ease-in-out;
}

.projects a:hover{
border-bottom: 1px solid #CCCCCC;
}

.projects li .project-media{
overflow: hidden;
height: 228px;
opacity: 1;
transition: opacity .4s ease-in-out;
-moz-transition: opacity .4s ease-in-out;
-webkit-transition: opacity .4s ease-in-out;
-o-transition: opacity .4s ease-in-out;
}

.projects a:hover .project-media{
opacity: 0.8; /* c */
}



.project-info{
padding-top: 7px;
padding-left: 3px;
}

h4.unfiltered{
color:#CCCCCC;
}

.project-media.unfiltered{
background: #CCCCCC;
}

.project-media.unfiltered img{
transition: opacity .4s ease-in-out;
-moz-transition: opacity .4s ease-in-out;
-webkit-transition: opacity .4s ease-in-out;
-o-transition: opacity .4s ease-in-out;
opacity: 0.2;
}

.projects a:hover .project-media.unfiltered img{
opacity: 1;
}

.ajax-results{
display:none;
}
/* - */

/* Posts */
.post{
overflow: hidden;
}

.post .media-col *:first-child:not(img, a img){
    padding-top: 5px;
}

.post .media-col p:last-child{
padding-bottom: 45px;
}

.post .media-col p{
width: 456px;
}

.post .media-col img{
width: 616px;
height: auto;
padding-bottom: 4px;
}


footer{
    clear:left;
    overflow: hidden;
}

.post-archives{
width: 1240px;
margin-left: 15px;
padding-top: 8px;
margin-bottom: 45px;
}

.post-archives ul{
    margin-top: 1px;
}

.archive-divider{
  border-bottom: 1px solid #CCCCCC;
  display: block;
  float: right;
  padding-top: 12px;
  width: 80px;
}


#production-grid{
width: 936px;
padding-top: 2px;
}

.production-page{
width: 244px;
padding-right: 60px;
}

.production-content{
padding-bottom: 45px;
}

.production-content p:last-child{
padding-bottom: 0;
}

.production-border{
border-top: 1px solid #CCCCCC;
padding-top: 4px;
}
/* - */

#search-grid{
    margin-bottom: 72px;
}

.search-divider{
  border-bottom: 1px solid #CCCCCC;
  display: inline-block;
  padding-top: 16px;
  width: 80px;
  float: left;
}

.search-archives{
padding-left: 15px;
background: #FFFFFF;
position: fixed;
z-index:1000;
overflow: hidden;
width: 1240px;
bottom: 0;
height: 72px;
}

.search-archives div{
border-top: 1px solid #CCCCCC;
padding-top: 4px;
}

.search-archives a{
padding-left: 2px;
}

.page-content{
padding: 2px 0 0 0;
}

#map{
    width:1240px;
    height:698px;
}

.end{
height: 8px;
background: #FFFF00;
}

.hidden{/* a */
display:none;
}
/* float helpers */
.left{
float: left;
}

.right{
float: right;
}

.col-left{
float:left;
margin-right: 8px;
}

.clr{
clear: both;
}
/* - */


/* columns */
.col-half{
width: 148px;
}

.col-one{
width: 304px;
}

.col-two{
width: 616px;
}

.col-three{
width: 928px;
}

.full{
width: 1240px;
}

.last{
margin-right: 0;
}
/* - */



header.short-header{
height: 68px;
}

#main.short{
margin-top: 137px;
}

#main.single-header-short{
margin-top: 71px;
}

#project-grid.fixed{
padding-top: 89px;
}

#project-grid.short-nav.fixed{
padding-top: 69px;
}

nav.sub.short-nav{
margin-top: 69px;
height: 62px;
overflow: hidden;
}

nav.detached.short-nav{
margin-top: 0;
height: 60px;
}

nav.detached.short-nav.fixed{
margin-top: 68px;
}

.hamburger,
.mobile-page-title{
    display: none;
}


    .standard{
    width: 556px;
    padding-top: 6px;
    padding-right: 372px;
    padding-bottom: 30px;border-top: 1px solid #CCCCCC;
}

.standard h2{
    padding-bottom: 10px;
    color: #666666;
}

.standard p,
.standard ul{
    font-size: 14px;
    line-height: 19px;
    margin-bottom: 19px;
    padding-bottom: 0;
}




/* media queries */
@media screen and (min-width: 0px) and (max-width: 1140px) {
            
            /* HEADER */
            nav.main{ width: 624px; }
            header > .col-half{ display: none; }
            header, #main, nav.sub{ width: 936px; }
        
            /* projects */
            #project-grid{ width: 936px; }
            
            #featured-work .media-col.col-three,
            #project-content .media-col,
            #project-content .media-col.col-three .video iframe,
            .standard{
                width: 624px;
            }
            
            #project-content .media-col.two-cols,
            #project-content .media-col.bigtext{
                padding-right: 0;
            }
            
            #project-content .media-col.bigtext{ float: left; }
            
            /* need to figure this into adaptWidth in js 552-349= 203 offset in height! */
            #project-content .media-col.col-three .video iframe{
                height: 351px;
            }
            
            /* HOME PAGE */
            #carousel3{ display: none; }
            .search-archives div:last-child{ display: none; }
            .home-archives{ width: 936px; }
            .home-archives div.right{ display:none; }
            .home-archives div:nth-child(2){ width: 296px !important; }
        
            /* CONTACT */
            #map{
                width: 936px;
            }


             .standard{
                float: left;
                padding-right: 0px;
            }
        }