/* ----|| PORTFOLIO ||---- */

.portfolio-content { width:100%; }
.pf-block { width:100%; margin-left:0; margin-bottom:30px; position:relative; }
.pf-block-wide { width:100%; margin-left:0; }

.pf-header { margin-left:0; }
.pf-header-wide { margin-left:0; }
.pf-block p { margin-left:0; font-family:"Cousine", Consolas, "Anonymous Pro", monospace; font-size:15px; font-weight:normal; line-height:20px; color:#212222; }
.pf-block-wide p { margin-left:0; }
.pf-block-wide .footnote-list { margin:18px 0 0 0; }

.pf-secondary { margin-top:18px; }

.pf-txt-left-col { width:100%; margin-left:0; float:none; }
.pf-txt-left-col p { margin-left:0; }

.pf-screen { margin-left:0; float:none; }
.pf-screen-2 { width:100%; }
.pf-screen-3 { width:45%; margin-right:2.5%; float:left; }
.pf-screen-3:nth-child(4) { width:100%; }
.pf-screen-3:nth-child(4) img { width:45%; margin-right:2.5%; float:left; }
.pf-screen-3:nth-child(4) img:nth-child(odd) { clear:left; }
.pf-screen-4 { width:100%; }

.pf-screen img { display:block; max-width:100%; margin:0 0 18px 0; padding:0; position:relative; }

.pf-placed-iphone { width:100%; }
.pf-placed-iphone img { display:block; width:100%; margin:0 0 18px 0; padding:0; }
.pf-placed-single-left { display:none; }
.pf-placed-bent-wireframe-text { width:100%; }


/*------------
    TARGET = smart phones - landscape mode */
    @media (min-width:480px) {
        .pf-screen-4 { width:45%; margin-right:2.5%; float:left; }
    }


/*------------
    TARGET = SPECIAL breakpoint - Portfolio */
    @media (min-width:530px) {
        .pf-screen-2 { width:45%; margin-right:2.5%; float:left; }
        .pf-placed-iphone { width:45%; }
    }


/*------------
    TARGET = Tablets - portrait mode */
    @media (min-width:768px) {
        .page-portfolio .site-further-details { display:block; width:100%; position:static; }

        .portfolio-content { max-width:842px; width:77.963%;/*842*/ margin:0 0 0 22.037%; /*238*/ }

        .pf-block { width:102.138%; /*860/842*/ margin-left:-2.138%; /*18/842*/ margin-bottom:60px; position:relative; }
        .pf-block-wide { width:130.404%; /*1098/842*/ margin-left:-30.404%; /*256/842*/ }

        .pf-header { margin-left:2.093%; /*18/860*/ }
        .pf-header-wide { margin-left:23.315%; /*256/1098*/ }
        .pf-block p { margin-left:2.093%; /*18/860*/ font-family:"Cousine", Consolas, "Anonymous Pro", monospace; font-size:15px; font-weight:normal; line-height:20px; color:#212222; }
        .pf-block-wide p { margin-left:23.315%; /*256/1098*/ }
        .pf-block-wide .footnote-list { margin:24px 0 0 23.315%; /*256/1098*/ }

        .pf-txt-left-col { width:100%; margin-left:0; float:none; }
        .pf-txt-left-col p { margin-left:9px; }

        .pf-screen { margin-left:2.093%; /*18/860*/ float:left; }
        .pf-block-wide .pf-screen { margin-left:1.640%; /*18/1098*/ }
        .pf-screen-2 { max-width:412px; width:47.907%; /*412/860*/ margin-right:0; }
        .pf-screen-3 { width:45%; margin-right:2.5%; float:left; }
        .pf-screen-3:nth-child(4) { width:100%; }
        .pf-screen-3:nth-child(4) img { width:45%; margin-right:2.5%; float:left; }
        .pf-screen-3:nth-child(4) img:nth-child(odd) { clear:left; }
        .pf-screen-4 { max-width:256px; width:23.315%; /*256/1098*/ margin-right:0; }

        .pf-screen img { display:block; max-width:100%; margin:0 0 18px 0; padding:0; }

        .pf-placed-iphone { width:382px; position:absolute; right:-68px; bottom:-48px; }
        .pf-placed-single-left { display:none; }

        .pf-placed-bent-wireframe-text { width:75.581%; /*650/860*/ position:absolute; left:-27.674%; /*238/860*/ bottom:0; }
        .pf-placed-bent-wireframe-text p { font-size:13px; line-height:18px; }
    }

/*------------
    TARGET = SPECIAL breakpoint - Portfolio */
    @media (min-width:800px) {
        .pf-screen-3 { max-width:268px; width:24.408%; /*268/1098*/ margin-right:0; }
        .pf-screen-3:nth-child(4) { max-width:268px; width:24.408%; /*268/1098*/ }
        .pf-screen-3:nth-child(4) img { max-width:268px; width:100%; float:none; }
        .pf-screen-3:nth-child(4) img:nth-child(odd) { clear:none; }
    }

/*------------
    TARGET = SPECIAL breakpoint - Portfolio */
    @media (min-width:990px) {
        .pf-txt-left-col { width:20.036%; /*220/1098*/ margin-left:1.730%; /*19/1098*/ float:left; }
        .pf-txt-left-col p { margin-left:0; font-size:12px; line-height:16px; }
    }


/*------------
    TARGET = Tablets - landscape mode */
    @media (min-width:1024px) {
        .pf-txt-left-col p { font-size:13px; line-height:18px; }

        .pf-placed-bent-wireframe-text p { font-size:15px; line-height:20px; }
    }


/*------------
    TARGET = Desktops */
    @media (min-width:1278px) {
        .page-portfolio .site-further-details { width:20.370%; /*220*/ position:absolute; left:0; top:400px; }

        .pf-txt-left-col p { font-size:15px; line-height:20px; }

        .pf-placed-single-left { display:block; position:absolute; left:-220px; bottom:249px; }

        .pf-placed-bent-wireframe-text { width:75.581%; /*650/860*/position:absolute; left:-27.674%; /*238/860*/ bottom:auto; top:1528px; }
    }