/*
    COLOURS:
    Header bg:     #1F202C
    slider dots:   rgba(31, 32, 44, 0.5)
    green:         #70BE9A
    
    copy headings: #1F202C
    
*/


@font-face {
    font-family: 'dinregular';
    src: url('../fonts/din-webfont.eot');
    src: url('../fonts/din-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/din-webfont.woff2') format('woff2'),
         url('../fonts/din-webfont.woff') format('woff'),
         url('../fonts/din-webfont.ttf') format('truetype'),
         url('../fonts/din-webfont.svg#dinregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


/* Fader */

.fader,
.main-navigation a,
.header-social a,
.nav-previous,
.nav-next{
    transition:all .5s;
}


hr{
    background-color:#ccc;
    margin:24px 0;
}


.divider{
    float: left;
    clear: both;
    width: 100%;
    margin:24px 0;
    display:block;
    background:#f00;
    height:10px;
}

.hentry{
    margin:0;
}


/*! Share icons */

#primary .sharedaddy{
    border-top:1px solid #ccc;
    padding-top:24px;
    margin-top:24px;
}

#primary .sd-social-icon .sd-content ul li[class*=share-] a{
    background:#70BE9A;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;
    text-align:center;
    margin:0;
}


#primary .sd-social-icon .sd-content ul li[class*=share-] a:before{
    font-size:20px;
    line-height:20px;
}


#primary .sd-content{
    display:block;
    margin-left:0.5em;
    float:left;
}

#primary .sd-content ul{
    margin:0!important;
}

#primary .sd-content ul li{
    margin-left:0.5em!important;
}

#primary div.sharedaddy h3.sd-title{
    display:block;
    float:left;
    margin:0 0 24px;
}

#primary div.sharedaddy h3.sd-title:before{
    margin:0;
    border:none;
}







/*! Sub reset */
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child,
p:first-child{
    margin-top:0
}

h1, h2, h3, h4, h5, h6{
    font-weight:normal;
    font-family: 'ocr-a-std', sans-serif;
    line-height:1.2;
    margin:24px 0 0;
}

.home h1{
    font-size:36px;
}

h1{
    font-size:36px;
}

h2, h3{
    font-size:28px;
}

.post-link-wrapper h2{
    min-height:86px;
}

.projects h2{
    min-height:66px;
}

@media (min-width:580px)
{
    h1{
        font-size:48px;
    }    
}

@media (min-width:768px)
{
    h1{
        font-size:65px;
    }
    
    h3{
        font-size:32px;
    }
    
}






h1.page-title,
h1.entry-title{
    text-align:center;
    margin:0 0 24px;
    text-transform: uppercase;
    padding-left:12px;
    padding-right:12px;
    line-height:1.2em;
}

/*h2:not(.post h2) {
    font-size:48px;
}*/



#primary div.sharedaddy h3.sd-title{
    font-size:32px;
    
}





p, ul{
    margin:22px 0 0;
}


.secondary p{
    margin-top:1em;
}


img{
    max-width:100%;
    height:auto;
    display:block;

}

/*! Links */
a:link,
a:visited,
a:hover,
a:active{
    color:#70BE9A;
    text-decoration:none;
}

a:hover{
    text-decoration:underline;
}

span.edit-link{
    position:absolute;
    z-index: 500;
}

.post-link-wrapper .readmore{
    position:absolute;
    bottom:88px;
}

.readmore:after{
    content:' >';
    color:#70BE9A;
}





body{
    font-family: 'dinregular', sans-serif;
    font-size:18px;
    line-height:27px;
    color:#1F202C;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    background:#f4f4f4;
}


/*! Layout */
.container{
    padding-left: 12px;
    padding-right:12px;
}

.module{
    padding:24px;
}

footer#colophon .module{
    padding:24px 0;
}

.module.content-area{
    padding:0;    
}

.nopad{
    padding:0!important;
}

.module.col-thin{
    padding-left:350px;
    padding-right:350px;
}

.site-header{
    background:#1F202C;
    height:155px;
    position:relative;
}


.site-header:before{
    content:'';
    display:block;
    background:#fff;
    height:10px;
    position:absolute;
    width:100%;
    top:95px;
}

.site-header .module{
    padding:24px 0 10px;
}

.site-header .module.strapline{
    margin-top:12px;
    padding:10px 24px 24px;
}

.clear{
    clear:left;
}

.entry-content,
.homepage-copy{
    background-image:url('../images/asterisk-bg.png');
    background-repeat: no-repeat;
    background-position: 90% 24px;
    padding:38px 0 48px;
}

.homepage-copy{
    padding:88px 0;
}


@media (max-width:1049px)
{
    .entry-content [class*='col'],
    .archive-items  .archive-item:nth-child(-n+3){
        margin-top:48px;
    }
    
    .entry-content [class*='col']:first-child{
        margin-top:0;
    }
    
    .archive-items  .archive-item:first-child{
        margin-top:0;
    }
    
    
}




/*! Adds a gap on grid layouts */
.archive-items{
    position:relative;
}

.archive-items .archive-item:nth-child(3n+1),
article .services-item:nth-child(2n+1){
    clear:both;
}


.archive-items .archive-item,
.archive-items .services-item{
    margin-top:48px;
}


@media (min-width:1050px)
{
    .archive-items .archive-item:nth-child(-n+3){
        margin-top:0;
    }   
}


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




/*! Header */


.strapline-logo{
    margin-left:230px;
    position:absolute;
    top:112px;
}

@media (max-width:1350px)
{
    .strapline-logo{
        margin-left:142px
    }
}


.asterisk{
    width:270px;
    height:115px;
    left:0;
    right:0;
    margin:0 auto;
    background:url('../images/header-triangle.png') no-repeat center center;
    position:absolute;
    z-index: 1500;
}

.asterisk img{
    position:absolute;
    top:-20px;
    left:0;
    right:0;
    margin:0 auto;
    opacity: 0;

}

.entry-content{
    margin-top:0;
}

/*
.entry-header{
    position:absolute;
    top:0;
    left:0;
    right:0;
    margin:120px auto 0;
    z-index: 1000;
    text-align:center;
    color:#fff;
}
*/

/*! Header social */

.header-social{
    padding:0; margin:0;
    list-style: none;
    float:right;
}

.header-social li{
    float:left;
    margin-left:6px;
}

.header-social a{
    display:inline-block;
    width:24px;
    height:24px;
    font-family: 'Genericons';
    background:#70BE9A;
    color:#fff;
    font-size:18px;
    text-align: center;
    line-height:24px;
    -webkit-border-radius: 4px;
       -moz-border-radius:4px;
            border-radius:4px;
}


.header-social a:hover{
    text-decoration: none;
    background:#3b6451;
    
}


.header-social a[href*='twitter']:before{  content:'\f202';}

.header-social a[href*='vimeo']:before{    content:'\f212';}

.header-social a[href*='facebook']:before{ content:'\f204';}

.header-social a[href*='google']:before{   content:'\f218';}

.header-social a[href*='mailto']:before{   content:'\f410';}


/*! Main navigation */
#site-navigation.main-navigation{
    position:absolute;
    bottom:10px;
    right:12px;
    width:80%;
}

#primary-menu{
    overflow:hidden;
    float:right;
}

#primary-menu li{
    margin-left:22px;
}

#primary-menu a{
    font-size:16px;
    line-height:1;
    text-transform: uppercase;
}

#primary-menu a:hover,
#primary-menu li.current-menu-item a,
#primary-menu li.current_page_parent a,
#primary-menu li.current-page-ancestor a{
    text-decoration: none;
    color:#ccc;
}


.slicknav_menu{
    display:none;
}

.slicknav_nav a{
    font-size:18px;
}

.slicknav_nav a:hover{
    text-decoration: none;
}




@media (max-width:1050px)
{
    .slicknav_menu{
        display:block;
        position:fixed;
        top:0;
        left:0;
        width:100%;
        z-index: 2000;
    }
    
    #page{
        padding-top:54px;
    }
     
}


/*! Header */
.header-logo{
/*     max-width:480px; */

    float:left;
}






/*! Slider */
main .flexslider,
main .metaslider .flexslider{
    border:none;
    margin:0;
}

main .metaslider{
    z-index: 1000;
}


.flexslider li{
/*     position:relative; */
}



#page .slider-caption,
#page .ms_content_wrap{
    position:absolute;
    background:rgba(255,255,255,0.8)!important;
    padding:11px!important;
    bottom:22px!important;
    left:22px!important;
    width:350px!important;
    color:#1F202C!important;
    height:auto!important;
}





#page .slider-caption h2,
#page .ms_content_wrap h2{
    font-size:35px;
    margin:0;
    font-family:'dinregular', sans-serif;
    color:#1F202C!important;
}

#page .slider-caption p,
#page .ms_content_wrap p{
    margin:11px 0 0;
    line-height:22px;
    color:#1F202C!important;
}

#main .flex-control-nav{
    bottom:40px;
    right:22px;
    z-index: 9999;
    width:auto;
}

#main .flex-control-paging li a{
    border-radius: 0;
    width:40px;
    height:25px;
    background:rgba(31, 32, 44, 0.5);
}

#main .flex-control-paging li a.flex-active,
#main .flex-control-paging li a:hover{
    background:#70BE9A;
}





/*! POst link */


.post-link-wrapper{
    width:50%;
    float:left;
    min-height:250px;
    position:relative;
    z-index: 1;
    padding:44px!important;
    color:#fff;
}

.post-link-wrapper a{
    color:#fff;
}

.post-link-wrapper a:hover{
    text-decoration: none;
}

.overlay{
    background:rgba(31, 32, 44, 0.3);
}

.overlay + a{
    display:block;
    width:100%;
    height:100%;
    position: absolute;
    left:0;
    top:0;
    z-index: 10;
}


.post-link-wrapper .overlay{
    display:block;
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    z-index: -1;
}


.post-link-wrapper:hover > .overlay{
    background:rgba(31, 32, 44, 1);
}



.post-link-wrapper h2{
    font-family: 'dinregular', sans-serif;
    font-size:36px;
    margin:0;
}


/*! Projects */


.post-link-wrapper.projects{
    background-repeat: no-repeat;
    background-size:cover;
    background-position:center center;
    color:#fff;
    min-height:300px;
}

/*! Posts */

.post-link-wrapper.posts{
    min-height:250px;
}

p.post-type{
    text-transform:uppercase;
}

.post-link-wrapper.posts h2 a{
    color:#70BE9A;
}


.post-link-wrapper.posts .overlay{
    background:rgba(31, 32, 44, 1);
}

.post-link-wrapper.posts:hover > .overlay{
    background:rgba(31, 32, 44, 0.4);
}



/*
.post-link-wrapper.posts:nth-child(2){
    background:rgba(31, 32, 44, 0.1);
} 

.post-link-wrapper.posts:nth-child(1):hover > .overlay{
    background:rgba(31, 32, 44, 0.3)!important;
}
*/




/*


.archives.posts .post-link-wrapper{
    height:auto;
    min-height:225px;
}



.post-link-wrapper h2 a,
.post-link-wrapper h2 a:hover,
.post-link-wrapper a{
    color:#fff;
    text-decoration:none;
}



.posts .post-link-wrapper h2 a,
.posts .post-link-wrapper h2 a:hover{
    color:#70BE9A;
    background:none;
}




.post-link-wrapper .module{
    padding:44px;
    position: relative;
    z-index: 500;
    height:100%;
}


.post-link-wrapper .overlay,
.posts .post-link-wrapper span{
    display:block;
    width:100%;
    height:100%;
    background:rgba(31, 32, 44, 0.3);
    position:absolute;
    top:0;
    left:0;
    z-index: 1;
}

.archives.posts  a{
    display:block;
    background:rgba(31, 32, 44, 0.3);
    height:100%;
    width:100%;
    padding:44px;
    position:absolute;
}


.post-link-wrapper:hover > .overlay{
    background:rgba(31, 32, 44, 1);
}

.posts .post-link-wrapper:nth-child(1){
    background:rgba(31, 32, 44, 1);    
}




.posts .post-link-wrapper:nth-child(1):hover > .overlay{
    background:rgba(31, 32, 44, 1); 
}   
*/






/*! Projects page */

.post-link-content{
    padding-right:1em;
}
















/*! Work */
section.work{
    padding-top:0;
}

.work article{
    margin-top:24px;
}



/*! Blog */
.site-main .comment-navigation, 
.site-main .posts-navigation, 
.site-main .post-navigation{
    margin:0;
/*
    margin-top:48px;
    padding-top:12px;
    border-top:1px solid #70BE9A;
*/
}

/* Pagination */
.blog .overlay,
.nav-next,
.nav-previous{
/*     width:50%; */
/*     min-height:250px; */
/*     background:#333; */
}

.nav-next:hover,
.nav-previous:hover{
    background:#ccc;
}


.post-meta{
    clear:both;
    margin-top:12px;
    font-size:12px;
    border-top:1px solid #ccc;
    padding-top:12px;
}


.post-meta span{
    clear:both;
    display:block;
}

.post-meta span.edit-link{
    margin-top:12px;
    font-weight:700;
    position:relative;
}


/*! Widgets */
.widget{
    margin:24px 0 0;
    padding-top:24px;
    border-top:1px solid #ccc;
}

.widget:first-child{
    margin-top:0;
    padding-top:0;
    border:none;
}

/*
.widget ul{
    margin:0;
    padding:0;
}
*/



/*! Forms */
#main .contact-form input[type="text"],
#main .contact-form input[type="email"], 
#main .contact-form textarea{
    max-width:100%;
    width:100%;
}

input[type="submit"]{
    background:#70BE9A;
    box-shadow:none;
    color:#fff;
    text-shadow:none;
    font-size:18px;
    border:none;
    -moz-border-radius:4px;
    padding:0.5em 1em
}
    
input[type="submit"]:hover{
    opacity:0.6;
    box-shadow:none;
}





/*! Footer */
footer{
    font-size:12px;
        background:#1F202C;

}

footer{
    color:#fff;
}

footer p{
    margin:0;
}

footer .attri p{
    text-align:right;
}

footer a:link,
footer a:active,
footer a:visited{
    color:#fff;
    text-decoration: none;
}

footer a:hover{
    text-decoration: underline;
}



#secondary-menu{
    margin:0;
    padding:0;
    list-style: none;
    text-align:center;
}

#secondary-menu li{
    display:inline-block;
    float:none;
    margin:0 6px;
}

#secondary-menu a{
    font-size:13px;
    text-transform: uppercase;
    color:#70BE9A;
}

#secondary-menu a:hover,
#secondary-menu li.current-menu-item a,
#secondary-menu li.current-page-ancestor a,
#secondary-menu li.current_page_parent a{
    color:#fff;
    text-decoration: none;
}


footer .module{
    color:#fff;
}



/*!
**** MEDIA QUERIES
*/

@media (max-width:1050px)
{
    .post-link-wrapper{
        width:100%;
        float:none;
    }
    
    .col-md-12{
        width:100%;
    }
    
    #site-navigation{
        display:none;
    }
    
/*
    .archives.posts .post-link-wrapper{
        height:auto;
    }
    
    .archives.posts .post-link-wrapper a{
        position:relative;
    }
*/
    
    
}


@media (max-width:420px)
{
    .strapline-logo{
        left:0;
        right:0;
        margin:0 auto;
        position:relative;
        top:auto;
    } 
    
    .site-header{
        height:auto;
        padding-bottom:24px;
    }
    
    .site-header:before{
        display:none;
    }
    
    
    #main .flex-control-paging li a{
        width:20px;
        height:20px;
    }
    
    .blog .post-link-wrapper h2{
        font-size:28px;
        text-align:center;
    }
    
    
}



@media (max-width:600px)
{
    .post-link-wrapper .readmore{
        position:relative;
        bottom:auto;
    }
    
    .post-link-wrapper .module{
        padding-left:44px;
        padding-right:44px;
    }
    
    .post-link-wrapper{
        height:auto;
    }
    
    
}


@media (max-width:680px)
{
    .asterisk{
        display:none;
    }
}




@media (max-width:480px)
{
    .post-link-wrapper .module{
        padding:22px;
    }
    
    
    
}

@media (min-width:460px)
{
       
}


@media (max-width:560px)
{
    

    

    
    .header-social{
        margin:0 auto 15px;
        float:none;
        text-align:center;
    }
    
    .header-social li{
        display:inline;
        float:none;
    }
    
    
    
    .strapline-logo{
/*
        top:130px;
        position:relative;
        top:auto;
        margin:0 auto;
*/
    } 
    
    
/*
    .site-header:before {
        display:none;   
    }
*/
    
    
    
    
    #main .flex-control-nav{
        bottom:-40px;
        right:0;
        left:0;
        margin:0 auto;
    }
    
}




@media (max-width: 1049px)
{

    footer [class*='col-'],
    footer .attri p{
        text-align:center;
        line-height:1.8em;
    }
    
    footer [class*='col-']{
        margin:15px 0;
    }
    
    
    
}


@media (max-width:1050px)
{
    .post-link-wrapper h2{
        min-height:auto;
        margin:0 0 12px;
    }
    
    .post-link-wrapper .readmore{
        position:relative;
        bottom:auto;
    }
    
    .post-link-wrapper.projects{
        min-height:auto;
        height:auto;
    }
    
}




@media (min-width:1050px) and (max-width:1350px)
{
    footer .col-lg-12{
        width:100%;
    }
    
    footer .col-lg-6{
        width:50%;
    }
    
    #secondary-menu{
        text-align:right;
    }
    
    footer .attri p{
        text-align:center;
    }
       
}


@media (max-width:1349px)
{
    .header-logo{
        width:400px;
    }

    
}


