.garamond{
   font-family:"Garamond";
   font-style:italic;
   font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
.museo-100{
   font-family:"museo-sans",sans-serif;
   font-style:normal;
   font-weight:100
}
.museo-700{
   font-family:"museo-sans",sans-serif;
   font-style:normal;
   font-weight:700;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
.color_black{
   color:#000
}
.color_white{
   color:#fff
}
.color_grey{
   color:#878787
}
.color_yellow{
   color:#ffb808
}
.color_turquoise{
   color:#25484c
}
.color_gold-dark{
   color:#d4ba8c
}
.color_royal-blue{
   color:#0b1438
}
.color_blue-dark{
   color:#0b2d52
}


h1,h2,h3,h4,h5,h6{
   font-family:"museo-sans",sans-serif;
   font-style:normal;
   font-weight:700;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale
}
h1,h2{
   font-size:1em;
   color:#fff;
   line-height:1.1em;
   letter-spacing:.094em;
   text-transform:uppercase;
   margin:.65em 0
}
.index-page h1,.index-page h2{
   margin:0
}
@media only screen and (max-width: 680px){
   .index-page h1,.index-page h2{
       font-size:2.38vw;
       line-height:1.25em
    }
}
.index-page.keywords h1,.index-page.keywords h2{
   margin:0;
   text-transform:capitalize;
   font-family:"Garamond";
   font-style:italic;
   font-weight:100;
   -webkit-font-smoothing:antialiased;
   -moz-osx-font-smoothing:grayscale;
   color:#fff;
   font-size:1.063em;
   letter-spacing:.05em
}
@media only screen and (max-width: 680px){
   .index-page.keywords h1,.index-page.keywords h2{
       font-size:2.38vw;
       line-height:1.25em
    }
}
@media only screen and (min-width: 1100px){
   .index-page.keywords h1,.index-page.keywords h2{
       font-size:1.0225em
    }
}
h3{
   font-size:1em;
   color:#fff;
   line-height:1.4em;
   letter-spacing:.094em;
   text-transform:uppercase
}
p,dl,ul{
   font-family:"museo-sans",sans-serif;
   font-style:normal;
   font-weight:100;
   color:#b0b0b0;
   font-size:.8em;
   line-height:1.4em;
   letter-spacing:.094em
}
.index-page.keywords .box p{
   font-family:"museo-sans",sans-serif !important;
   font-style:normal !important;
   font-weight:800 !important;
   font-size:3.25vw !important;
   letter-spacing:.04em !important;
   -webkit-font-smoothing:antialiased !important;
   -moz-osx-font-smoothing:grayscale !important
}
@media only screen and (max-width: 680px){
   .index-page.keywords .box p{
       font-size:3.5vw !important
    }
}
@media only screen and (min-width: 1100px){
   .index-page.keywords .box p{
       font-size:2.25rem !important
    }
}
dl dd a,dl dd a:visited,dl dd a:active{
   color:#b0b0b0;
   text-decoration:none;
   cursor:pointer
}
dl dd a:hover,dl dd a:visited:hover,dl dd a:active:hover{
   color:#ffb808
}
.quote{
   text-align:center
}
.quote q{
   font-family:"Garamond";
   font-style:italic;
   font-weight:100;
   -webkit-font-smoothing:antialiased;
   -moz-osx-font-smoothing:grayscale;
   font-size:1.25em;
   color:#fff;
   line-height:1.4em;
   letter-spacing:.094em;
   text-transform:uppercase
}
@media only screen and (min-width: 681px){
    #project-name{width:55%}
}
@media only screen and (min-width: 681px){
    #project-name{width:55%}
}
#project-name p{
    list-style:none;
    letter-spacing:.05em;
    line-height:.9em;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    -webkit-font-smoothing:antialiased;
    font-weight:900;
    margin-top:.65rem;
    color:#fff;
    font-size:4.65vw
}
@media only screen and (max-width: 680px){
    #project-name p{
        font-size:8.25vw
    }
}
@media only screen and (min-width: 1100px){
    #project-name p{
        font-size:3.225rem
    }
}
:root{
    --process-margin: 4px;
    --brand-size: 12vw
}
.brand{
    display:flex;
    position:fixed;
    border-radius:50%;
    top:0;
    z-index:2;
    transition:all .15s linear
}
.brand:hover{
    width:calc(var(--brand-size) + 9.5vw);height:calc(var(--brand-size) + 9.5vw);
    border-radius:30% 100%
}
.brand-home{
    display:flex;
    position:fixed;
    border-radius:50%;
    z-index:1;
    width:var(--brand-size);
    height:var(--brand-size);
    transform-origin:top left;
    transform:scale(1.2)
}
.brand-home #upBrand-home{
    width:var(--brand-size);
    height:var(--brand-size);
    transform-origin:top left;
    transform:scale(1.2)
}
.navmenu01{
    position:sticky;
    top:3.3%;
    padding-right:3%;
    margin:0px;
    font-size:1em;
    line-height:1.1em;
    letter-spacing:.094em;
    text-transform:uppercase;
    margin:.65em 0;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    z-index:3
}
.navmenu01 a p{
    width:21px;
    height:2px;
    background-color:#828282;
    margin:4px 0
}
.navmenu01 a:hover p{
    background-color:#fdb713 !important
}
#go-process{
    display:flex;
    text-decoration:none;
    transform-origin:center;
    margin:auto 1vw 1vw auto;
    border-radius:50%
}
#go-process span{
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    border:.3vw solid #000;
    border-radius:50%;
    background-color:#fff;
    margin-left:-1vw;color:#000;
    font-family:"Montserrat Regular";
    font-size:1.15vw;
    line-height:1.15vw;
    letter-spacing:.05vw;
    color:#000;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
.brand,#upBrand,#go-process span{
    width:var(--brand-size);
    height:var(--brand-size);
    transform-origin:top left
}
.brand:hover,#upBrand:hover,#go-process:hover{
    animation:expand 1s;
    transform:scale(1.2)
}
#upBrand{
    position:absolute;
    transition:none;
    border-radius:0 0 50%;
    animation-name:shimmy;
    animation-duration:10s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
    animation-delay:0s
}
@keyframes shimmy{
    92%{transform:translate3d(-4px, 0, 0)}
    93%{transform:translate3d(4px, 0, 0)}
    94%{transform:translate3d(-3px, 0, 0)}
    95%{transform:translate3d(3px, 0, 0)}
    96%{transform:translate3d(-2px, 0, 0)}
    97%{transform:translate3d(2px, 0, 0)}
    98%{transform:translate3d(-1px, 0, 0)}
    99%{transform:translate3d(1px, 0, 0)}
    100%{transform:translate3d(0, 0, 0)}
}
@keyframes expand{
    0%{transform:scale(1)}
    25%{transform:scale(1.35)}
    40%{transform:scale(1.15)}
    60%{transform:scale(1.3)}
    80%{transform:scale(1.18)}
    100%{transform:scale(1.2)}
}
header.site-wide-header{
    top:0;
    left:0;
    right:0;
    z-index:0;
    background-color:#000;
    border-bottom:1px solid #595858;
    text-align:center;
    padding:1.85em 0
}
@media only screen and (max-width: 680px){
    header.site-wide-header{
        width:90%;
        margin:0 auto !important;
        position:relative;
        border:none;
        border-bottom:1px solid #868484
}
header.site-wide-header .mobile-break{
    display:none}
}
header.site-wide-header .box{
    margin:0 auto !important;
    width:60%
}
@media only screen and (max-width: 680px){
    header.site-wide-header .box{
        width:80%
    }
}
header.site-wide-header .box p{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:800;
    font-size:2.25rem;
    letter-spacing:.04em;
    color:#fff;
    display:block;
    color:#fff;
    text-transform:capitalize;
    -webkit-font-smoothing:antialiased !important;
    text-align:center
}
@media only screen and (max-width: 680px){
    header.site-wide-header .box p{
        font-size:4.5vw
    }
}
header.site-wide-header .box h1{
    display:block;
    color:#b0b0b0 !important;
    line-height:1.25em;
    font-size:1.063em;
    letter-spacing:.05em;
    text-transform:capitalize;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased
}
@media only screen and (max-width: 680px){
    header.site-wide-header .box h1{
        font-size:3vw
    }
}
.wrapper{
    width:90%;
    max-width:1150px;
    margin:0 auto;
    padding:5% 0 50px
}
@media only screen and (max-width: 680px){
    .wrapper{
        padding-bottom:5%
    }
}
.wrapper header{
    width:55%;
    float:left
}
@media only screen and (min-width: 681px){
    .wrapper header{
        margin-bottom:8%}
}@media only screen and (max-width: 680px){
    .wrapper header{
        width:100%;
        padding:1% 0 4% 0;
        border-bottom:1px solid #878787
    }
}
.wrapper header p:not(:last-of-type){
    margin-bottom:4%
}
section.services{
    width:42%;
    float:right
}
@media only screen and (min-width: 681px){
    section.services{
        margin-bottom:8%
    }
}
@media only screen and (max-width: 680px){
    section.services{
        width:100%;
        padding-top:2%
    }
}
section.services dl{
    margin-bottom:4%
}
section.services dl dt{
    display:inline-block;
    text-transform:uppercase
}
section.services dl dd{
    display:inline
}
.studio section.services.services{
    clear:right;
    margin-bottom:2%
}
@media only screen and (max-width: 680px){
    .studio section.services.services:not(:first-of-type){
        margin-top:2%
    }
}
.studio section.services.services:not(:first-of-type){
    border-top:1px solid #878787;
    padding-top:1%
}
.studio section.services.services ul{
    margin-bottom:2%
}
.studio section.services.services ul li{
    display:inline;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-size:1.45em
}
aside{
    width:100%;
    margin:.5% 0;
    padding:3.67167% 0;
    overflow:hidden;
    position:relative;
    background-color:#878787
}
@media only screen and (max-width: 680px){
    aside{
        background-color:#000;
        padding:0
    }
}
aside .project-brand{
    position:absolute;
    top:0;left:0;
    right:0;
    bottom:0;
    margin-left:.5%
}
@media only screen and (max-width: 680px){
    aside .project-brand{
        display:none
    }
}
aside .project-brand img{
    max-width:70%
}
aside .credits{
    float:right;
    padding:2% 5%;
    border-left:2px solid #fff
}
@media only screen and (max-width: 680px){
    aside .credits{
        width:100%;
        padding:4% 0;
        margin:4% 0;
        border-left:none;
        border-top:1px solid #878787;
        border-bottom:1px solid #878787
    }
}
aside .credits p{
    font-weight:300
}
@media only screen and (min-width: 681px){
    aside .credits p{
        margin-bottom:2%;
        color:#000
    }
}
@media only screen and (max-width: 680px){
    aside .credits p{margin-bottom:4%
    }
}
aside .credits p a{
    font-weight:100
}
.project-page aside .credits p:first-of-type{
    font-size:.8em;
    color:#fff
}
@media only screen and (max-width: 375px){
    .project-page aside .credits p:first-of-type{
        font-size:3.4vw
    }
}
aside .credits p:last-of-type{
    margin:0
}
footer{
    position:fixed;
    bottom:0;
    left:5%;
    right:5%;
    max-width:1150px;
    min-height:56px;
    width:90%;
    height:3.5em;
    margin:0 auto;
    background:#25484c;
    border-top:.85vw solid #000;
    border-bottom:.85vw solid #000;
    transform:translateX(0%)
}
@media only screen and (min-width: 1100px){
    footer{
        border-top:.65em solid #000;
        border-bottom:.65em solid #000;
        height:3.5em
    }
}
@media only screen and (max-width: 680px){
    footer{
        position:relative;
        left:0;
        right:0;
        width:90%;
        height:80px;
        margin:.5% auto 5% auto;
        border:none
    }
}
footer .contact{
    position:absolute;
    top:50%;
    left:2%;
    transform:translateY(-50%)
}
footer .contact a{
    color:#fff;
    font-size:.85em;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:100
}
@media only screen and (max-width: 680px){
    footer .contact a{
        display:block;
        text-align:left}
    footer .contact a .blt{
        display:none
    }
}
footer .social{
    position:absolute;
    top:50%;
    right:2%;
    transform:translateY(-50%)
}
@media only screen and (max-width: 680px){
    footer .social{
        transform:translateY(0%)
    }
}
footer .social img{
    width:22px;
    margin-left:5px;
    float:right;
    background-color:#fff
}
footer .social img:hover{
    background:#ffb808
}
*,*:after,*:before{
    margin:0;
    padding:0;
    -ms-box-sizing:border-box;
    -o-box-sizing:border-box;
    box-sizing:border-box
}
.wf-loading *,.wf-loading *:after,.wf-loading *:before{
    visibility:hidden
}
.row,article,.wrapper{
    *zoom:1
}
.row:before,article:before,.wrapper:before,.row:after,article:after,.wrapper:after{
    content:" ";
    display:table
}
.row:after,article:after,.wrapper:after{
    clear:both
}
img{
    width:auto;
    max-width:100%;
    height:auto !important
}
a,a:visited,a:active{
    color:#fff;
    text-decoration:none;
    cursor:pointer
}
html,body{
    background-color:#18191B
}
body.noscroll{
    overflow:hidden
}
.no-bottom{
    margin-bottom:0 !important
}
.center{
    margin-left:.75% !important;
    margin-right:.75% !important
}
.right{
    float:right !important
}
.b-l{
    position:absolute !important;
    bottom:0 !important;
    left:0 !important
}
@media only screen and (max-width: 680px){
    .b-l{
        position:relative !important
    }
}
.b-r{
    position:absolute !important;
    bottom:0 !important;
    right:0 !important
}
@media only screen and (max-width: 680px){
    .b-r{
        position:relative !important
    }
}
.b-r p{
    margin-bottom:0 !important
}




/*--------------------------------------------------------------
# Toolbox Images
--------------------------------------------------------------*/

.floor-area-calculator{background-image:url("img/pcstudios/modern-bathroom-interiors-white-floating-tub-custom-wood-vanity.jpg")}


.new-vs-reno-roof{background-image:url("img/construction-timeline/los-angeles-modern-architecture-long-beach-surf-house-by-pcstudios-architects.jpg")}
.new-vs-reno-ceiling{background-image:url("img/construction-timeline/los-angeles-orange-county-modern-home-interiors-by-pcstudios.jpg")}
.new-vs-reno-kitchen{background-image:url("img/construction-timeline/custom-modern-kitchen-interior-cost-analysis.jpg")}
.new-vs-reno-plan{background-image:url("img/construction-timeline/open-plan-modern-interior-architecture-minimal-living-dining-entry-space.jpg")}
.new-vs-reno-basement{background-image:url("img/construction-timeline/los-angeles-modern-home-construction-high-ceiling-basement.jpg")}
.new-vs-reno-windows{background-image:url("img/construction-timeline/los-angeles-orange-county-ca-modern-architecture-beach-house-with-private-roof-deck-and-plunge-pool.jpg")}


.timeframe-calculator{background-image:url("img/pcstudios/modern-bath-interior-white-stone-wrapped-walnut-vanity-faucet.jpg")}

.constructiontimeline-01{background-image:url("img/pcstudios/custom-modern-home-constuction-process-timeline.png")}

.thankyou-01{background-image:url("img/pcstudios/custom-modern-home-cost-calculator-tool-by-pcstudios.jpg")}

.thankyou-02{background-image:url("img/budget-calculator/modern-living-room-interiors-in-los-angeles-custom-home.jpg")}


.garamond{
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
.museo-100{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:100
}
.museo-700{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
.color_black{
    color:#000
}
.color_white{
    color:#fff
}
.color_grey{
    color:#878787
}
.color_yellow{
    color:#ffb808
}
.color_turquoise{
    color:#25484c
}
h1,h2,h3,h4,h5,h6{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
h1,h2{
    font-size:1em;color:#fff;
    line-height:1.1em;
    letter-spacing:.094em;
    text-transform:uppercase;
    margin:.65em 0
}
.index-page h1,.index-page h2{
    margin:0
}
@media only screen and (max-width: 680px){
    .index-page h1,.index-page h2{
        font-size:2.38vw;
        line-height:1.25em
    }
}
.index-page.keywords h1,.index-page.keywords h2{
    margin:0;
    text-transform:capitalize;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    color:#fff;
    font-size:1.063em;
    letter-spacing:.05em
}
@media only screen and (max-width: 680px){
    .index-page.keywords h1,.index-page.keywords h2{
        font-size:2.38vw;
        line-height:1.25em
    }
}
@media only screen and (min-width: 1100px){
    .index-page.keywords h1,.index-page.keywords h2{
        font-size:1.0225em
    }
}
h3{
    font-size:1em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:uppercase
}
p,dl,ul{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:100;
    color:#b0b0b0;
    font-size:.8em;
    line-height:1.4em;
    letter-spacing:.094em
}
.index-page.keywords .box p{
    font-family:"museo-sans",sans-serif !important;
    font-style:normal !important;
    font-weight:800 !important;
    font-size:3.25vw !important;
    letter-spacing:.04em !important;
    -webkit-font-smoothing:antialiased !important;
    -moz-osx-font-smoothing:grayscale !important
}
@media only screen and (max-width: 680px){
    .index-page.keywords .box p{
        font-size:3.5vw !important
    }
}
@media only screen and (min-width: 1100px){
    .index-page.keywords .box p{font-size:2.25rem !important
    }
}
dl dd a,dl dd a:visited,dl dd a:active{
    color:#b0b0b0;
    text-decoration:none;
    cursor:pointer
}
dl dd a:hover,dl dd a:visited:hover,dl dd a:active:hover{
    color:#ffb808
}
.quote{
    text-align:center
}
.quote q{
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-size:1.25em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:uppercase
}
@media only screen and (min-width: 681px){
    #project-name{
        width:55%
    }
}
@media only screen and (min-width: 681px){
    #project-name{
        width:55%
    }
}
#project-name p{
    list-style:none;
    letter-spacing:.05em;
    line-height:.9em;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    -webkit-font-smoothing:antialiased;
    font-weight:900;
    margin-top:.65rem;
    color:#fff;
    font-size:4.65vw
}
@media only screen and (max-width: 680px){
    #project-name p{
        font-size:8.25vw
    }
}
@media only screen and (min-width: 1100px){
    #project-name p{
        font-size:3.225rem
    }
}


.garamond{
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
.museo-100{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:100
}
.museo-700{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
.color_black{
    color:#000
}
.color_white{
    color:#fff
}
.color_grey{
    color:#878787
}
.color_yellow{
    color:#ffb808
}
.color_turquoise{
    color:#25484c
}
h1,h2,h3,h4,h5,h6{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
h1,h2{
    font-size:1em;
    color:#fff;
    line-height:1.1em;
    letter-spacing:.094em;
    text-transform:uppercase;
    margin:.65em 0
}
.index-page h1,.index-page h2{
    margin:0
}
@media only screen and (max-width: 680px){
    .index-page h1,.index-page h2{
        font-size:2.38vw;
        line-height:1.25em
    }
}
.index-page.keywords h1,.index-page.keywords h2{
    margin:0;
    text-transform:capitalize;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    color:#fff;
    font-size:1.063em;
    letter-spacing:.05em
}
@media only screen and (max-width: 680px){
    .index-page.keywords h1,.index-page.keywords h2{
        font-size:2.38vw;
        line-height:1.25em
    }
}
@media only screen and (min-width: 1100px){
    .index-page.keywords h1,.index-page.keywords h2{
        font-size:1.0225em
    }
}
h3{
    font-size:1em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:uppercase
}
p,dl,ul{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:100;
    color:#b0b0b0;
    font-size:.8em;
    line-height:1.4em;
    letter-spacing:.094em
}
.index-page.keywords .box p{
    font-family:"museo-sans",sans-serif !important;
    font-style:normal !important;
    font-weight:800 !important;
    font-size:3.25vw !important;
    letter-spacing:.04em !important;
    -webkit-font-smoothing:antialiased !important;
    -moz-osx-font-smoothing:grayscale !important
}
@media only screen and (max-width: 680px){
    .index-page.keywords .box p{
        font-size:3.5vw !important
    }
}
@media only screen and (min-width: 1100px){
    .index-page.keywords .box p{
        font-size:2.25rem !important
    }
}
dl dd a,dl dd a:visited,dl dd a:active{
    color:#b0b0b0;
    text-decoration:none;
    cursor:pointer
}
dl dd a:hover,dl dd a:visited:hover,dl dd a:active:hover{
    color:#ffb808
}
.quote{
    text-align:center
}
.quote q{
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-size:1.25em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:uppercase
}
@media only screen and (min-width: 681px){
    #project-name{
        width:55%
    }
}
@media only screen and (min-width: 681px){
    #project-name{
        width:55%
    }
}
#project-name p{
    list-style:none;
    letter-spacing:.05em;
    line-height:.9em;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    -webkit-font-smoothing:antialiased;
    font-weight:900;
    margin-top:.65rem;
    color:#fff;
    font-size:4.65vw
}
@media only screen and (max-width: 680px){
    #project-name p{
        font-size:8.25vw
    }
}
@media only screen and (min-width: 1100px){
    #project-name p{
        font-size:3.225rem
    }
}
.lic-map .wrapper .map{
    overflow:hidden;
    margin-bottom:5%
}
.lic-map .wrapper .map .map__image{
    border:2px solid #000
}
.lic-map .wrapper .map .map__image svg{
    width:100%;
    margin:0 auto
}
.lic-map .wrapper .map .map__image circle{
    opacity:0
}
.lic-map .wrapper .map .map__image text{
    padding:10px;
    font-size:1em;
    fill:#fff;
    visibility:hidden;
    stroke:none
}
.lic-map .wrapper .map .map__image .active text,.lic-map .wrapper .map .map__image .is-active text{
    visibility:visible
}
.lic-map .wrapper .title{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-transform:uppercase
}
@media only screen and (max-width: 680px){
    .lic-map .wrapper .title{
        font-size:24px !important
    }
}
@media only screen and (min-width: 681px){
    .lic-map .wrapper .title{
        font-size:18px !important
    }
}
.lic-map .wrapper .desc{
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
@media only screen and (max-width: 680px){
    .lic-map .wrapper .desc{
        font-size:23px !important
    }
}
@media only screen and (min-width: 681px){
    .lic-map .wrapper .desc{
        font-size:18px !important
    }
}
.lic-map .wrapper header{
    width:32%;
    float:left
}
@media only screen and (max-width: 680px){
    .lic-map .wrapper header{
        width:100%
    }
}
.lic-map .wrapper .row{
    padding-bottom:2%
}
.lic-map .wrapper section.lic-arch{
    width:66%;
    float:right
}
@media only screen and (max-width: 680px){
    .lic-map .wrapper section.lic-arch{
        width:100%
    }
}
@media only screen and (min-width: 681px){
    .lic-map .wrapper section.lic-arch{
        margin-bottom:8%
    }

}
.lic-map .wrapper .phil{
    margin:0
}
@media only screen and (max-width: 680px){
    .lic-map .wrapper .phil{
        border-top:1px solid #878787
    }
}
.lic-map .wrapper h3{
    color:#fff
}
@media only screen and (max-width: 680px){
    .lic-map .wrapper h3{
        width:100%
    }
}
@media only screen and (min-width: 681px){
    .lic-map .wrapper h3{
        font-size:1.425vw
    }
}
@media only screen and (min-width: 1100px){
    .lic-map .wrapper h3{
        font-size:.98em
    }
}
.lic-map .wrapper h3 span{
    display:block;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-transform:capitalize
}
@media only screen and (max-width: 680px){
    .lic-map .wrapper h3 span{
        margin-bottom:2%
    }
}
@media only screen and (min-width: 681px){
    .lic-map .wrapper h3 span{
        margin:2% 0;
        font-size:1.55vw
    }
}
@media only screen and (min-width: 1100px){
    .lic-map .wrapper h3 span{
        font-size:1em
    }
}
.lic-map .wrapper p{
    display:block !important
}
.lic-map .wrapper .center{
    margin:0 !important
}
@media only screen and (min-width: 681px){
    .lic-map .wrapper .add-pad{
        padding-left:2% !important
    }
}
@media only screen and (max-width: 680px){
    .window{
        display:none
    }
}
@media only screen and (max-width: 680px){
    .lightbox{
        display:none
    }
}
@media only screen and (min-width: 681px){
    .lightbox{
        position:fixed;
        overflow:hidden;
        top:0px;
        left:0px;
        padding:0px;
        z-index:99;
        text-align:center;
        background-color:rgba(0,0,0,.85)
    }
    .lightbox a{
        z-index:2;
        position:absolute;
        top:0;
        bottom:0;
        left:0;
        right:0;
        overflow:hidden;
        opacity:0;
        filter:alpha(opacity=0);
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)"
    }
    .lightbox a img{
        position:absolute;
        max-height:70%;
        top:50%;
        padding:0 4em;
        opacity:0;
        filter:alpha(opacity=0);
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)";
        transform:translate(-50%, -50%)
    }
    .lightbox a.lb-prev img,.lightbox a.lb-next img{
        padding:0 !important
    }
    .lightbox:target{
        width:auto;
        height:auto;
        bottom:0px;
        right:0px
    }
    .lightbox:target img,.lightbox:target a{
        opacity:1;
        filter:alpha(opacity=99);
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=99)"
    }
    .lightbox x:-o-prefocus,.lightbox .lightbox img{
        height:100%
    }
}
.lb-prev{
    position:relative;
    width:50px;
    right:auto;
    left:0
}
.lb-next{
    position:relative;
    width:50px;
    right:0;
    left:auto !important
}
.index-page .phil:not(.colorfill){
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(100));
    filter:grayscale(100%)
}
.index-page .phil:not(.colorfill):hover{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='saturate' values='0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(0));
    filter:grayscale(0%)
}
.index-page .phil:not(.colorfill) a{
    background-color:rgba(0,0,0,.45)
}
.index-page .phil:not(.colorfill) a:hover{
    background-color:rgba(0,0,0,0)
}
.studio-page .hover-yellow{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(100));
    filter:grayscale(100%)
}
.studio-page .hover-yellow:hover{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='saturate' values='0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(0));
    filter:grayscale(0%)
}
.studio-page .hover-yellow a{
    background-color:rgba(0,0,0,.45)
}
.studio-page .hover-yellow a:hover{
    background-color:#ffb808
}
header.head{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:1;
    background-color:#000;
    border-bottom:1px solid #868484;
    text-align:center;
    padding:1.85em 0
}
@media only screen and (max-width: 680px){
    header.head{
        width:90%;
        margin:0 auto;
        position:relative;
        border:none;
        border-bottom:1px solid #868484
    }
    header.head .mobile-break{
        display:none
    }
}
header.head>h1{
    margin:0;
    display:inline
}
header.head>p{
    display:inline;
    font-size:1.063em;
    text-transform:capitalize
}
@media only screen and (max-width: 680px){
    header.head>p{
        display:none
    }
}
article{
    width:90%;
    max-width:1150px;
    padding:8.5em 0 50px;
    margin:0 auto
}
@media only screen and (max-width: 680px){
    article{
        padding:5% 0
    }
}
article header{
    float:left
}
@media only screen and (min-width: 681px){
    article header{
        margin-bottom:8%
    }
}
@media only screen and (max-width: 680px){
    article header{
        width:100%;
        padding:1% 0 4% 0;
        border-bottom:1px solid #878787
    }
}
article header p:not(:last-of-type){
    margin-bottom:4%
}
@media only screen and (max-width: 680px){
    article header h2{
        text-align:center
    }
}
article header span{
    display:block;
    font-size:1.063em !important;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
.index-blog article{
    padding:0
}
@media only screen and (max-width: 680px){
    .index-blog article{
        padding-top:4%
    }
}
@media only screen and (min-width: 681px){
    .index-blog article{
        padding:.5% 0
    }
    .index-blog article:first-of-type{
        margin-top:6.65em
    }
    .index-blog article:last-of-type{
        padding-bottom:50px
    }
}
.index-blog article.row:not(:first-of-type){
    border-top:1px solid #868484
}
.index-blog article .phil{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='saturate' values='0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(0));
    filter:grayscale(0%)
}
.index-blog article .phil:hover{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(100));
    filter:grayscale(100%)
}
.index-blog article .phil a{
    background-color:rgba(0,0,0,0)
}
.index-blog article .phil a .box{
    opacity:0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter:alpha(opacity=0)
}
.index-blog article .phil a:hover{
    background-color:rgba(0,0,0,.45)
}
.index-blog article .phil a:hover .box{
    opacity:1;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter:alpha(opacity=100)
}
.index-blog article .phil .box p:first-of-type{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-size:1em;
    line-height:1.4em;
    letter-spacing:.094em;
    color:#fff;
    text-transform:uppercase
}
@media only screen and (max-width: 680px){
    .index-blog article .phil .box p.garamond{
        font-size:1em
    }
}
.index-blog article .phil.copywrite{
    position:absolute;
    top:50%;
    right:0;
    transform:translate(0%, -50%)
}
.index-blog article .phil.copywrite img{
    width:14%;
    margin-right:2%
}
@media only screen and (max-width: 680px){
    .index-blog article .phil.copywrite{
        position:relative !important;
        transform:translate(0%, 0%)
    }
    .index-blog article .phil.copywrite img{
        float:right;
        width:10%;
        clear:left
    }
    .index-blog article .phil.copywrite h2{
        text-align:left;
        margin-top:0
    }
    .index-blog article .phil.copywrite p{
        clear:both
    }
}
.index-blog article .phil.copywrite span{
    display:block;
    font-size:1.063em !important;
    text-transform:capitalize;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
.paragraph{
    width:42%;
    float:right
}
@media only screen and (min-width: 681px){
    .paragraph{
        margin-bottom:8%;
        margin-top:4em
    }
}
@media only screen and (max-width: 680px){
    .paragraph{
        width:100%;
        padding-top:2%
    }
}
.quarter{
    width:24.25% !important;
    padding:16.17167% 0 !important
}
@media only screen and (min-width: 681px){
    .quarter.right{
        margin-right:1%
    }
}
@media only screen and (min-width: 681px){
    .blog-post article header{
        width:55%
    }
}
.blog-post .credits{
    border-left:none
}
.photo-credit{
    width:40%;
    clear:left !important
}
@media only screen and (max-width: 680px){
    .photo-credit{
        display:none
    }
}
.filler{
    position:absolute;
    top:0;left:0;
    right:0;
    bottom:0
}
.filler .box{
    text-align:center;
    position:absolute;top:50%;
    left:0;
    right:0;
    transform:translate(0%, -50%)
}
.filler .box>p{
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    color:#fff;
    font-size:1.063em;
    line-height:1em;
    letter-spacing:.05em
}
@media only screen and (max-width: 680px){
    .filler .box>p{
        font-size:2.38vw
    }
}
@media only screen and (min-width: 1100px){
    .filler .box>p{
        font-size:1.065em
    }
}
.introduction{
    padding-bottom:3.25rem;
    margin-bottom:3.25rem;
    border-bottom:1px solid #aaa
}
@media only screen and (min-width: 681px){
    .introduction{
        padding-top:3.25rem
    }
}
@media only screen and (max-width: 680px){
    .introduction{
        padding-bottom:3%;
        margin-bottom:7%
    }
}
.introduction p{
    margin-bottom:1rem
}
.phase{
    display:flex;
    margin-bottom:6rem
}
@media only screen and (max-width: 680px){
    .phase{
        flex-direction:column
    }
}
@media only screen and (max-width: 680px){
    .phase>div{margin-bottom:1rem
    }
}
@media only screen and (min-width: 681px){
    .phase>div{
        width:50%
    }
    .phase>div:first-of-type{
        margin-right:1rem
    }
}
.phase>div span{
    font-size:1.5rem;
    color:#fff
}
.phase>div h2{
    font-size:1.5rem;
    margin-top:0;
    color:#fff
}
.phase>div p{
    margin-bottom:1rem
}
.to-process-page{
    width:100%;
    height:4rem;
    background-color:#eee
}
.to-process-page a{
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%;
    height:100%;
    padding:1rem;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:100;
    color:#000;
    font-size:.8em;
    line-height:1.4em;
    letter-spacing:.094em;
    text-align:center
}
@media only screen and (max-width: 680px){
    .mailchimp-download{
        order:2
    }
}
.mailchimp-download #mc_embed_signup #mce-EMAIL{
    padding:.4em;
    font-family:"museo-sans",sans-serif !important;
    font-style:normal !important;
    font-weight:300 !important;
    font-size:1em !important;
    line-height:1.4em;
    letter-spacing:.094em;
    -webkit-font-smoothing:antialiased;
    outline:none;
    border:none;
    width:100%;
    margin-bottom:1rem;
    text-align:center
}
@media only screen and (max-width: 680px){
    .mailchimp-download #mc_embed_signup #mce-EMAIL{
        margin-bottom:.25rem
    }
}
.mailchimp-download #mc_embed_signup .button{
    text-align:center;
    outline:none;
    border:none;
    background-color:#eee;
    font-family:"museo-sans",sans-serif !important;
    font-style:normal !important;
    font-weight:300 !important;
    font-size:1em !important;
    color:#000 !important;
    padding:.5em .25em;
    text-transform:uppercase;
    width:100%
}
@media only screen and (max-width: 680px){
    .mailchimp-download #mc_embed_signup .button{
        margin-top:.25rem !important;
        margin-bottom:1rem
    }
}
@media only screen and (max-width: 680px){
    .learn-more{
        order:1
    }
}








.video{
    position:relative;
    margin:0 0 .5% 0;
    padding:28% 0;
    overflow:hidden
}
.video iframe{
    position:absolute;
    top:0;left:0;
    width:100%;
    height:100%
}
.video559{
    width:41.16667% !important;
    padding:20.5% 0 !important;
    margin:.5% 0 !important
}
@media only screen and (max-width: 680px){
    .video559{
        width:100% !important;
        padding:50.5% 0 !important
    }
}
.videolongislandproject{
    width:100% !important;
    padding:33% 0 !important;
    margin:.5% 0 !important
}
.videocolumns-6x4{
    width:49% !important;
    padding:0% 0 !important;
    margin:.5% 0 !important
}
.colorfill{
    background-color:#545454
}
.colorfill #aboutUP p{
    line-height:.5em;color:#ffb808
}
.colorfill #aboutUP p span{
    line-height:1em
}
.colorfill #aboutUP p span#we-are{
    line-height:1em;
    margin:0;
    text-transform:capitalize;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-size:.6em;
    letter-spacing:.025em
}
.colorfill:hover{
    background-color:#ffb808
}
.copywrite{
    padding:0 !important
}
@media only screen and (max-width: 680px){
    .copywrite{
        width:100% !important;
        padding:4% 0 !important
    }
    .copywrite p{
        text-align:left !important
    }
}
.copywrite p:not(:last-of-type){
    margin-bottom:4%
}
.padding{
    padding-right:40% !important
}
@media only screen and (max-width: 680px){
    .padding{
        padding-right:0 !important
    }
}
.margin{
    margin-top:10% !important
}
@media only screen and (max-width: 680px){
    .margin{
        margin-top:.5% !important
    }
}
.thelongislandproject-06.margin{
    margin-top:15% !important
}
@media only screen and (max-width: 680px){
    .thelongislandproject-06.margin{
        margin-top:.5% !important
    }
}
.phil{
    width:auto;
    float:left;
    position:relative;
    background-size:cover;
    background-position:center;
    overflow:hidden
}
.phil>a{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.phil>a>p{
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    color:#fff;
    font-size:1.063em;
    line-height:1em;
    letter-spacing:.05em;
    text-align:center;
    position:absolute;
    top:50%;
    left:0;
    right:0;
    transform:translate(0%, -50%)
}
.phil>a .box{
    text-align:center;
    position:absolute;
    top:50%;
    left:0;
    right:0;
    transform:translate(0%, -50%);
    padding:.5rem
}
.phil>a .box>p{
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    color:#fff;
    font-size:1.063em;
    line-height:1em;
    letter-spacing:.05em
}
@media only screen and (max-width: 680px){
    .phil>a .box>p{
        font-size:2.38vw
    }
}
@media only screen and (min-width: 1100px){
    .phil>a .box>p{
        font-size:1.065em
    }
}
[class*=columns-]{
    margin:.5% 0
}
.row{
    position:relative;
    overflow:hidden;
    margin:0 auto;
    clear:both
}
@media only screen and (min-width: 681px){
    .project-page .row:not(.related-projects),.blog-post .row:not(.related-projects){
        margin-bottom:8%
    }
}
.columns-1x1{
    width:7.8333333333%;
    padding:3.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-1x1,.blog-post .row:not(:last-of-type) .columns-1x1,.index-blog .row .columns-1x1{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-1x1{
        width:7.8333333333% !important;
        padding:3.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-1x2{
    width:7.8333333333%;
    padding:7.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-1x2,.blog-post .row:not(:last-of-type) .columns-1x2,.index-blog .row .columns-1x2{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-1x2{
        width:7.8333333333% !important;
        padding:7.8383333333% 0 !important
    }
    .sm-none{display:none
    }
}
.columns-1x3{
    width:7.8333333333%;
    padding:12.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-1x3,.blog-post .row:not(:last-of-type) .columns-1x3,.index-blog .row .columns-1x3{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-1x3{
        width:7.8333333333% !important;
        padding:12.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-1x4{
    width:7.8333333333%;
    padding:16.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-1x4,.blog-post .row:not(:last-of-type) .columns-1x4,.index-blog .row .columns-1x4{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-1x4{
        width:7.8333333333% !important;
        padding:16.1716666667% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-1x5{
    width:7.8333333333%;
    padding:20.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-1x5,.blog-post .row:not(:last-of-type) .columns-1x5,.index-blog .row .columns-1x5{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-1x5{
        width:7.8333333333% !important;
        padding:20.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-1x6{
    width:7.8333333333%;
    padding:24.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-1x6,.blog-post .row:not(:last-of-type) .columns-1x6,.index-blog .row .columns-1x6{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-1x6{
        width:7.8333333333% !important;
        padding:24.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-1x7{
    width:7.8333333333%;
    padding:28.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-1x7,.blog-post .row:not(:last-of-type) .columns-1x7,.index-blog .row .columns-1x7{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-1x7{
        width:7.8333333333% !important;
        padding:28.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-1x8{
    width:7.8333333333%;
    padding:32.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-1x8,.blog-post .row:not(:last-of-type) .columns-1x8,.index-blog .row .columns-1x8{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-1x8{
        width:7.8333333333% !important;
        padding:32.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-1x9{
    width:7.8333333333%;
    padding:37.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-1x9,.blog-post .row:not(:last-of-type) .columns-1x9,.index-blog .row .columns-1x9{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-1x9{
        width:7.8333333333% !important;
        padding:37.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-1x10{
    width:7.8333333333%;
    padding:41.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-1x10,.blog-post .row:not(:last-of-type) .columns-1x10,.index-blog .row .columns-1x10{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-1x10{
        width:7.8333333333% !important;
        padding:41.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-1x11{
    width:7.8333333333%;
    padding:45.3383333333% 0
}
@media only screen and (max-width: 680px){.project-page .row:not(:last-of-type) .columns-1x11,.blog-post .row:not(:last-of-type) .columns-1x11,.index-blog .row .columns-1x11{
    width:100%;
    padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-1x11{
        width:7.8333333333% !important;
        padding:45.3383333333% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-1x12{
    width:7.8333333333%;
    padding:49.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-1x12,.blog-post .row:not(:last-of-type) .columns-1x12,.index-blog .row .columns-1x12{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-1x12{
        width:7.8333333333% !important;
        padding:49.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-2x1{
    width:16.1666666667%;
    padding:3.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-2x1,.blog-post .row:not(:last-of-type) .columns-2x1,.index-blog .row .columns-2x1{
        width:100%;padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-2x1{
        width:16.1666666667% !important;
        padding:3.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-2x2{
    width:16.1666666667%;
    padding:7.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-2x2,.blog-post .row:not(:last-of-type) .columns-2x2,.index-blog .row .columns-2x2{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-2x2{
        width:16.1666666667% !important;
        padding:7.8383333333% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-2x3{width:
    16.1666666667%;
    padding:12.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-2x3,.blog-post .row:not(:last-of-type) .columns-2x3,.index-blog .row .columns-2x3{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){.sm-columns-2x3{
    width:16.1666666667% !important;
    padding:12.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-2x4{
    width:16.1666666667%;
    padding:16.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-2x4,.blog-post .row:not(:last-of-type) .columns-2x4,.index-blog .row .columns-2x4{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){.sm-columns-2x4{
    width:16.1666666667% !important;
    padding:16.1716666667% 0 !important
    }
    .sm-none{display:none
    }
}
.columns-2x5{
    width:16.1666666667%;
    padding:20.3383333333% 0
}
@media only screen and (max-width: 680px){.project-page .row:not(:last-of-type) .columns-2x5,.blog-post .row:not(:last-of-type) .columns-2x5,.index-blog .row .columns-2x5{
    width:100%;
    padding:80% 0
    }
}
@media only screen and (max-width: 680px){.sm-columns-2x5{width:16.1666666667% !important;
    padding:20.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-2x6{
    width:16.1666666667%;
    padding:24.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-2x6,.blog-post .row:not(:last-of-type) .columns-2x6,.index-blog .row .columns-2x6{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-2x6{
        width:16.1666666667% !important;
        padding:24.505% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-2x7{
    width:16.1666666667%;
    padding:28.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-2x7,.blog-post .row:not(:last-of-type) .columns-2x7,.index-blog .row .columns-2x7{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-2x7{
        width:16.1666666667% !important;
        padding:28.6716666667% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-2x8{
    width:16.1666666667%;
    padding:32.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-2x8,.blog-post .row:not(:last-of-type) .columns-2x8,.index-blog .row .columns-2x8{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-2x8{
        width:16.1666666667% !important;
        padding:32.8383333333% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-2x9{
    width:16.1666666667%;
    padding:37.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-2x9,.blog-post .row:not(:last-of-type) .columns-2x9,.index-blog .row .columns-2x9{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-2x9{
        width:16.1666666667% !important;
        padding:37.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-2x10{
    width:16.1666666667%;
    padding:41.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-2x10,.blog-post .row:not(:last-of-type) .columns-2x10,.index-blog .row .columns-2x10{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){.sm-columns-2x10{
    width:16.1666666667% !important;
    padding:41.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-2x11{
    width:16.1666666667%;
    padding:45.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-2x11,.blog-post .row:not(:last-of-type) .columns-2x11,.index-blog .row .columns-2x11{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-2x11{
        width:16.1666666667% !important;
        padding:45.3383333333% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-2x12{
    width:16.1666666667%;
    padding:49.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-2x12,.blog-post .row:not(:last-of-type) .columns-2x12,.index-blog .row .columns-2x12{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-2x12{
        width:16.1666666667% !important;
        padding:49.505% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-3x1{
    width:24.5%;
    padding:3.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-3x1,.blog-post .row:not(:last-of-type) .columns-3x1,.index-blog .row .columns-3x1{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-3x1{
        width:24.5% !important;
        padding:3.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-3x2{
    width:24.5%;
    padding:7.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-3x2,.blog-post .row:not(:last-of-type) .columns-3x2,.index-blog .row .columns-3x2{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-3x2{
        width:24.5% !important;
        padding:7.8383333333% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-3x3{
    width:24.5%;
    padding:12.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-3x3,.blog-post .row:not(:last-of-type) .columns-3x3,.index-blog .row .columns-3x3{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-3x3{
        width:24.5% !important;
        padding:12.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-3x4{
    width:24.5%;
    padding:16.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-3x4,.blog-post .row:not(:last-of-type) .columns-3x4,.index-blog .row .columns-3x4{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-3x4{
        width:24.5% !important;
        padding:16.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-3x5{
    width:24.5%;
    padding:20.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-3x5,.blog-post .row:not(:last-of-type) .columns-3x5,.index-blog .row .columns-3x5{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-3x5{
        width:24.5% !important;
        padding:20.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-3x6{
    width:24.5%;
    padding:24.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-3x6,.blog-post .row:not(:last-of-type) .columns-3x6,.index-blog .row .columns-3x6{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-3x6{
        width:24.5% !important;
        padding:24.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-3x7{
    width:24.5%;
    padding:28.6716666667% 0
}
@media only screen and (max-width: 680px){.project-page .row:not(:last-of-type) .columns-3x7,.blog-post .row:not(:last-of-type) .columns-3x7,.index-blog .row .columns-3x7{
    width:100%;
    padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-3x7{
        width:24.5% !important;
        padding:28.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-3x8{
    width:24.5%;
    padding:32.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-3x8,.blog-post .row:not(:last-of-type) .columns-3x8,.index-blog .row .columns-3x8{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-3x8{
    width:24.5% !important;
    padding:32.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-3x9{
    width:24.5%;
    padding:37.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-3x9,.blog-post .row:not(:last-of-type) .columns-3x9,.index-blog .row .columns-3x9{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-3x9{
        width:24.5% !important;
        padding:37.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-3x10{
    width:24.5%;
    padding:41.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-3x10,.blog-post .row:not(:last-of-type) .columns-3x10,.index-blog .row .columns-3x10{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-3x10{
        width:24.5% !important;
        padding:41.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-3x11{
    width:24.5%;
    padding:45.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-3x11,.blog-post .row:not(:last-of-type) .columns-3x11,.index-blog .row .columns-3x11{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-3x11{
        width:24.5% !important;
        padding:45.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-3x12{
    width:24.5%;
    padding:49.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-3x12,.blog-post .row:not(:last-of-type) .columns-3x12,.index-blog .row .columns-3x12{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-3x12{
        width:24.5% !important;
        padding:49.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-4x1{
    width:32.8333333333%;
    padding:3.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-4x1,.blog-post .row:not(:last-of-type) .columns-4x1,.index-blog .row .columns-4x1{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-4x1{
        width:32.8333333333% !important;
        padding:3.6716666667% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-4x2{
    width:32.8333333333%;
    padding:7.8383333333% 0
}
@media only screen and (max-width: 680px){.project-page .row:not(:last-of-type) .columns-4x2,.blog-post .row:not(:last-of-type) .columns-4x2,.index-blog .row .columns-4x2{
    width:100%;
    padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-4x2{
        width:32.8333333333% !important;
        padding:7.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-4x3{
    width:32.8333333333%;
    padding:12.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-4x3,.blog-post .row:not(:last-of-type) .columns-4x3,.index-blog .row .columns-4x3{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-4x3{
        width:32.8333333333% !important;
        padding:12.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-4x4{
    width:32.8333333333%;
    padding:16.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-4x4,.blog-post .row:not(:last-of-type) .columns-4x4,.index-blog .row .columns-4x4{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-4x4{
        width:32.8333333333% !important;
        padding:16.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-4x5{
    width:32.8333333333%;
    padding:20.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-4x5,.blog-post .row:not(:last-of-type) .columns-4x5,.index-blog .row .columns-4x5{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-4x5{
        width:32.8333333333% !important;
        padding:20.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-4x6{
    width:32.8333333333%;
    padding:24.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-4x6,.blog-post .row:not(:last-of-type) .columns-4x6,.index-blog .row .columns-4x6{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-4x6{
        width:32.8333333333% !important;
        padding:24.505% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-4x7{
    width:32.8333333333%;
    padding:28.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-4x7,.blog-post .row:not(:last-of-type) .columns-4x7,.index-blog .row .columns-4x7{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-4x7{
        width:32.8333333333% !important;
        padding:28.6716666667% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-4x8{
    width:32.8333333333%;
    padding:32.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-4x8,.blog-post .row:not(:last-of-type) .columns-4x8,.index-blog .row .columns-4x8{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-4x8{
        width:32.8333333333% !important;
        padding:32.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-4x9{
    width:32.8333333333%;
    padding:37.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-4x9,.blog-post .row:not(:last-of-type) .columns-4x9,.index-blog .row .columns-4x9{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-4x9{
        width:32.8333333333% !important;
        padding:37.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-4x10{
    width:32.8333333333%;
    padding:41.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-4x10,.blog-post .row:not(:last-of-type) .columns-4x10,.index-blog .row .columns-4x10{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-4x10{
        width:32.8333333333% !important;
        padding:41.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-4x11{
    width:32.8333333333%;
    padding:45.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-4x11,.blog-post .row:not(:last-of-type) .columns-4x11,.index-blog .row .columns-4x11{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-4x11{
        width:32.8333333333% !important;
        padding:45.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-4x12{
    width:32.8333333333%;
    padding:49.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-4x12,.blog-post .row:not(:last-of-type) .columns-4x12,.index-blog .row .columns-4x12{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-4x12{
        width:32.8333333333% !important;
        padding:49.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-5x1{
    width:41.1666666667%;
    padding:3.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-5x1,.blog-post .row:not(:last-of-type) .columns-5x1,.index-blog .row .columns-5x1{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-5x1{
        width:41.1666666667% !important;
        padding:3.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-5x2{
    width:41.1666666667%;
    padding:7.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-5x2,.blog-post .row:not(:last-of-type) .columns-5x2,.index-blog .row .columns-5x2{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-5x2{
        width:41.1666666667% !important;
        padding:7.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-5x3{
    width:41.1666666667%;
    padding:12.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-5x3,.blog-post .row:not(:last-of-type) .columns-5x3,.index-blog .row .columns-5x3{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-5x3{
        width:41.1666666667% !important;
        padding:12.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-5x4{
    width:41.1666666667%;
    padding:16.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-5x4,.blog-post .row:not(:last-of-type) .columns-5x4,.index-blog .row .columns-5x4{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-5x4{
        width:41.1666666667% !important;
        padding:16.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-5x5{
    width:41.1666666667%;
    padding:20.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-5x5,.blog-post .row:not(:last-of-type) .columns-5x5,.index-blog .row .columns-5x5{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-5x5{
        width:41.1666666667% !important;
        padding:20.3383333333% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-5x6{
    width:41.1666666667%;
    padding:24.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-5x6,.blog-post .row:not(:last-of-type) .columns-5x6,.index-blog .row .columns-5x6{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-5x6{
        width:41.1666666667% !important;
        padding:24.505% 0 !important}
    .sm-none{
        display:none
    }
}
.columns-5x7{
    width:41.1666666667%;
    padding:28.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-5x7,.blog-post .row:not(:last-of-type) .columns-5x7,.index-blog .row .columns-5x7{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-5x7{
        width:41.1666666667% !important;
        padding:28.6716666667% 0 !important}
    .sm-none{
        display:none
    }
}
.columns-5x8{
    width:41.1666666667%;
    padding:32.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-5x8,.blog-post .row:not(:last-of-type) .columns-5x8,.index-blog .row .columns-5x8{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-5x8{
        width:41.1666666667% !important;
        padding:32.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-5x9{
    width:41.1666666667%;
    padding:37.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-5x9,.blog-post .row:not(:last-of-type) .columns-5x9,.index-blog .row .columns-5x9{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-5x9{
        width:41.1666666667% !important;
        padding:37.005% 0 !important
    }
    .sm-none{
            display:none
    }
}
.columns-5x10{
    width:41.1666666667%;
    padding:41.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-5x10,.blog-post .row:not(:last-of-type) .columns-5x10,.index-blog .row .columns-5x10{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-5x10{
        width:41.1666666667% !important;
        padding:41.1716666667% 0 !important}
    .sm-none{
        display:none
    }
}
.columns-5x11{
    width:41.1666666667%;
    padding:45.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-5x11,.blog-post .row:not(:last-of-type) .columns-5x11,.index-blog .row .columns-5x11{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-5x11{
        width:41.1666666667% !important;
        padding:45.3383333333% 0 !important}
    .sm-none{
        display:none
    }
}
.columns-5x12{
    width:41.1666666667%;
    padding:49.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-5x12,.blog-post .row:not(:last-of-type) .columns-5x12,.index-blog .row .columns-5x12{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-5x12{
        width:41.1666666667% !important;
        padding:49.505% 0 !important}
    .sm-none{
        display:none
    }
}
.columns-6x1{
    width:49.5%;
    padding:3.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-6x1,.blog-post .row:not(:last-of-type) .columns-6x1,.index-blog .row .columns-6x1{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-6x1{
        width:49.5% !important;
        padding:3.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-6x2{
    width:49.5%;
    padding:7.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-6x2,.blog-post .row:not(:last-of-type) .columns-6x2,.index-blog .row .columns-6x2{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-6x2{
        width:49.5% !important;
        padding:7.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-6x3{
    width:49.5%;
    padding:12.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-6x3,.blog-post .row:not(:last-of-type) .columns-6x3,.index-blog .row .columns-6x3{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-6x3{
        width:49.5% !important;
        padding:12.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-6x4{
    width:49.5%;
    padding:16.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-6x4,.blog-post .row:not(:last-of-type) .columns-6x4,.index-blog .row .columns-6x4{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-6x4{
        width:49.5% !important;
        padding:16.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-6x5{
    width:49.5%;
    padding:20.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-6x5,.blog-post .row:not(:last-of-type) .columns-6x5,.index-blog .row .columns-6x5{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-6x5{
        width:49.5% !important;
        padding:20.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-6x6{
    width:49.5%;
    padding:24.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-6x6,.blog-post .row:not(:last-of-type) .columns-6x6,.index-blog .row .columns-6x6{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-6x6{
        width:49.5% !important;
        padding:24.505% 0 !important}
    .sm-none{
        display:none
    }
}
.columns-6x7{
    width:49.5%;
    padding:28.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-6x7,.blog-post .row:not(:last-of-type) .columns-6x7,.index-blog .row .columns-6x7{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-6x7{
        width:49.5% !important;
        padding:28.6716666667% 0 !important}
    .sm-none{
        display:none
    }
}
.columns-6x8{
    width:49.5%;
    padding:32.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-6x8,.blog-post .row:not(:last-of-type) .columns-6x8,.index-blog .row .columns-6x8{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-6x8{
        width:49.5% !important;
        padding:32.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-6x9{
    width:49.5%;
    padding:37.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-6x9,.blog-post .row:not(:last-of-type) .columns-6x9,.index-blog .row .columns-6x9{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-6x9{
        width:49.5% !important;
        padding:37.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-6x10{
    width:49.5%;
    padding:41.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-6x10,.blog-post .row:not(:last-of-type) .columns-6x10,.index-blog .row .columns-6x10{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-6x10{
        width:49.5% !important;padding:41.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-6x11{
    width:49.5%;
    padding:45.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-6x11,.blog-post .row:not(:last-of-type) .columns-6x11,.index-blog .row .columns-6x11{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-6x11{
        width:49.5% !important;
        padding:45.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-6x12{
    width:49.5%;
    padding:49.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-6x12,.blog-post .row:not(:last-of-type) .columns-6x12,.index-blog .row .columns-6x12{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-6x12{
        width:49.5% !important;
        padding:49.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-7x1{
    width:57.8333333333%;
    padding:3.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-7x1,.blog-post .row:not(:last-of-type) .columns-7x1,.index-blog .row .columns-7x1{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-7x1{
        width:57.8333333333% !important;
        padding:3.6716666667% 0 !important}
    .sm-none{
        display:none
    }
}
.columns-7x2{
    width:57.8333333333%;
    padding:7.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-7x2,.blog-post .row:not(:last-of-type) .columns-7x2,.index-blog .row .columns-7x2{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-7x2{
        width:57.8333333333% !important;
        padding:7.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-7x3{
    width:57.8333333333%;
    padding:12.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-7x3,.blog-post .row:not(:last-of-type) .columns-7x3,.index-blog .row .columns-7x3{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-7x3{
        width:57.8333333333% !important;
        padding:12.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-7x4{
    width:57.8333333333%;
    padding:16.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-7x4,.blog-post .row:not(:last-of-type) .columns-7x4,.index-blog .row .columns-7x4{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-7x4{
        width:57.8333333333% !important;
        padding:16.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-7x5{
    width:57.8333333333%;
    padding:20.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-7x5,.blog-post .row:not(:last-of-type) .columns-7x5,.index-blog .row .columns-7x5{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-7x5{
        width:57.8333333333% !important;
        padding:20.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-7x6{
    width:57.8333333333%;
    padding:24.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-7x6,.blog-post .row:not(:last-of-type) .columns-7x6,.index-blog .row .columns-7x6{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-7x6{
        width:57.8333333333% !important;
        padding:24.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-7x7{
    width:57.8333333333%;
    padding:28.6716666667% 0
}
@media only screen and (max-width: 680px){.project-page .row:not(:last-of-type) .columns-7x7,.blog-post .row:not(:last-of-type) .columns-7x7,.index-blog .row .columns-7x7{
    width:100%;
    padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-7x7{
        width:57.8333333333% !important;
        padding:28.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-7x8{
    width:57.8333333333%;
    padding:32.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-7x8,.blog-post .row:not(:last-of-type) .columns-7x8,.index-blog .row .columns-7x8{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-7x8{
        width:57.8333333333% !important;
        padding:32.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-7x9{
    width:57.8333333333%;
    padding:37.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-7x9,.blog-post .row:not(:last-of-type) .columns-7x9,.index-blog .row .columns-7x9{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-7x9{
        width:57.8333333333% !important;
        padding:37.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-7x10{
    width:57.8333333333%;
    padding:41.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-7x10,.blog-post .row:not(:last-of-type) .columns-7x10,.index-blog .row .columns-7x10{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-7x10{
        width:57.8333333333% !important;
        padding:41.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-7x11{
    width:57.8333333333%;
    padding:45.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-7x11,.blog-post .row:not(:last-of-type) .columns-7x11,.index-blog .row .columns-7x11{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-7x11{
        width:57.8333333333% !important;
        padding:45.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-7x12{
    width:57.8333333333%;
    padding:49.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-7x12,.blog-post .row:not(:last-of-type) .columns-7x12,.index-blog .row .columns-7x12{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-7x12{
        width:57.8333333333% !important;
        padding:49.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-8x1{
    width:66.1666666667%;
    padding:3.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-8x1,.blog-post .row:not(:last-of-type) .columns-8x1,.index-blog .row .columns-8x1{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-8x1{
        width:66.1666666667% !important;
        padding:3.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-8x2{
    width:66.1666666667%;
    padding:7.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-8x2,.blog-post .row:not(:last-of-type) .columns-8x2,.index-blog .row .columns-8x2{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-8x2{
        width:66.1666666667% !important;
        padding:7.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-8x3{
    width:66.1666666667%;
    padding:12.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-8x3,.blog-post .row:not(:last-of-type) .columns-8x3,.index-blog .row .columns-8x3{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-8x3{
        width:66.1666666667% !important;
        padding:12.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-8x4{
    width:66.1666666667%;
    padding:16.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-8x4,.blog-post .row:not(:last-of-type) .columns-8x4,.index-blog .row .columns-8x4{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-8x4{
        width:66.1666666667% !important;
        padding:16.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-8x5{
    width:66.1666666667%;
    padding:20.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-8x5,.blog-post .row:not(:last-of-type) .columns-8x5,.index-blog .row .columns-8x5{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-8x5{
        width:66.1666666667% !important;
        padding:20.3383333333% 0 !important
    }.sm-none{
        display:none
    }
}
.columns-8x6{
    width:66.1666666667%;
    padding:24.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-8x6,.blog-post .row:not(:last-of-type) .columns-8x6,.index-blog .row .columns-8x6{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-8x6{
        width:66.1666666667% !important;
        padding:24.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-8x7{
    width:66.1666666667%;
    padding:28.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-8x7,.blog-post .row:not(:last-of-type) .columns-8x7,.index-blog .row .columns-8x7{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-8x7{
        width:66.1666666667% !important;
        padding:28.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-8x8{
    width:66.1666666667%;
    padding:32.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-8x8,.blog-post .row:not(:last-of-type) .columns-8x8,.index-blog .row .columns-8x8{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-8x8{
        width:66.1666666667% !important;
        padding:32.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-8x9{
    width:66.1666666667%;
    padding:37.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-8x9,.blog-post .row:not(:last-of-type) .columns-8x9,.index-blog .row .columns-8x9{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-8x9{
        width:66.1666666667% !important;
        padding:37.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-8x10{
    width:66.1666666667%;
    padding:41.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-8x10,.blog-post .row:not(:last-of-type) .columns-8x10,.index-blog .row .columns-8x10{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-8x10{
        width:66.1666666667% !important;
        padding:41.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-8x11{
    width:66.1666666667%;
    padding:45.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-8x11,.blog-post .row:not(:last-of-type) .columns-8x11,.index-blog .row .columns-8x11{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-8x11{
        width:66.1666666667% !important;
        padding:45.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-8x12{
    width:66.1666666667%;
    padding:49.505% 0}@media only screen and (max-width: 680px){
        .project-page .row:not(:last-of-type) .columns-8x12,.blog-post .row:not(:last-of-type) .columns-8x12,.index-blog .row .columns-8x12{
            width:100%;
            padding:80% 0
        }
}
@media only screen and (max-width: 680px){
    .sm-columns-8x12{
        width:66.1666666667% !important;
        padding:49.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-9x1{
    width:74.5%;
    padding:3.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-9x1,.blog-post .row:not(:last-of-type) .columns-9x1,.index-blog .row .columns-9x1{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-9x1{
        width:74.5% !important;
        padding:3.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-9x2{
    width:74.5%;
    padding:7.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-9x2,.blog-post .row:not(:last-of-type) .columns-9x2,.index-blog .row .columns-9x2{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-9x2{
        width:74.5% !important;
        padding:7.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-9x3{
    width:74.5%;
    padding:12.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-9x3,.blog-post .row:not(:last-of-type) .columns-9x3,.index-blog .row .columns-9x3{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-9x3{
        width:74.5% !important;
        padding:12.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-9x4{
    width:74.5%;
    padding:16.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-9x4,.blog-post .row:not(:last-of-type) .columns-9x4,.index-blog .row .columns-9x4{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-9x4{
        width:74.5% !important;
        padding:16.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-9x5{
    width:74.5%;
    padding:20.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-9x5,.blog-post .row:not(:last-of-type) .columns-9x5,.index-blog .row .columns-9x5{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-9x5{
        width:74.5% !important;
        padding:20.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-9x6{
    width:74.5%;
    padding:24.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-9x6,.blog-post .row:not(:last-of-type) .columns-9x6,.index-blog .row .columns-9x6{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-9x6{
        width:74.5% !important;
        padding:24.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-9x7{
    width:74.5%;
    padding:28.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-9x7,.blog-post .row:not(:last-of-type) .columns-9x7,.index-blog .row .columns-9x7{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-9x7{
        width:74.5% !important;
        padding:28.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-9x8{
    width:74.5%;
    padding:32.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-9x8,.blog-post .row:not(:last-of-type) .columns-9x8,.index-blog .row .columns-9x8{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-9x8{
        width:74.5% !important;
        padding:32.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-9x9{
    width:74.5%;
    padding:37.005% 0
}
@media only screen and (max-width: 680px){.project-page .row:not(:last-of-type) .columns-9x9,.blog-post .row:not(:last-of-type) .columns-9x9,.index-blog .row .columns-9x9{
    width:100%;
    padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-9x9{
        width:74.5% !important;
        padding:37.005% 0 !important
    }.sm-none{
        display:none
    }
}
.columns-9x10{
    width:74.5%;
    padding:41.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-9x10,.blog-post .row:not(:last-of-type) .columns-9x10,.index-blog .row .columns-9x10{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-9x10{
        width:74.5% !important;
        padding:41.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-9x11{
    width:74.5%;
    padding:45.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-9x11,.blog-post .row:not(:last-of-type) .columns-9x11,.index-blog .row .columns-9x11{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-9x11{
        width:74.5% !important;
        padding:45.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-9x12{
    width:74.5%;
    padding:49.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-9x12,.blog-post .row:not(:last-of-type) .columns-9x12,.index-blog .row .columns-9x12{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-9x12{
        width:74.5% !important;
        padding:49.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-10x1{
    width:82.8333333333%;
    padding:3.6716666667% 0
}
@media only screen and (max-width: 680px){.project-page .row:not(:last-of-type) .columns-10x1,.blog-post .row:not(:last-of-type) .columns-10x1,.index-blog .row .columns-10x1{
    width:100%;
    padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-10x1{
        width:82.8333333333% !important;
        padding:3.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-10x2{
    width:82.8333333333%;
    padding:7.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-10x2,.blog-post .row:not(:last-of-type) .columns-10x2,.index-blog .row .columns-10x2{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-10x2{
        width:82.8333333333% !important;
        padding:7.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-10x3{
    width:82.8333333333%;
    padding:12.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-10x3,.blog-post .row:not(:last-of-type) .columns-10x3,.index-blog .row .columns-10x3{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-10x3{
        width:82.8333333333% !important;
        padding:12.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-10x4{
    width:82.8333333333%;
    padding:16.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-10x4,.blog-post .row:not(:last-of-type) .columns-10x4,.index-blog .row .columns-10x4{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-10x4{
        width:82.8333333333% !important;
        padding:16.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-10x5{
    width:82.8333333333%;
    padding:20.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-10x5,.blog-post .row:not(:last-of-type) .columns-10x5,.index-blog .row .columns-10x5{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-10x5{
        width:82.8333333333% !important;
        padding:20.3383333333% 0 !important
    }.sm-none{
        display:none
    }
}
.columns-10x6{
    width:82.8333333333%;
    padding:24.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-10x6,.blog-post .row:not(:last-of-type) .columns-10x6,.index-blog .row .columns-10x6{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-10x6{
        width:82.8333333333% !important;
        padding:24.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-10x7{
    width:82.8333333333%;
    padding:28.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-10x7,.blog-post .row:not(:last-of-type) .columns-10x7,.index-blog .row .columns-10x7{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-10x7{
        width:82.8333333333% !important;
        padding:28.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }

}
.columns-10x8{
    width:82.8333333333%;
    padding:32.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-10x8,.blog-post .row:not(:last-of-type) .columns-10x8,.index-blog .row .columns-10x8{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-10x8{
        width:82.8333333333% !important;
        padding:32.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-10x9{
    width:82.8333333333%;
    padding:37.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-10x9,.blog-post .row:not(:last-of-type) .columns-10x9,.index-blog .row .columns-10x9{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-10x9{
        width:82.8333333333% !important;
        padding:37.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-10x10{
    width:82.8333333333%;
    padding:41.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-10x10,.blog-post .row:not(:last-of-type) .columns-10x10,.index-blog .row .columns-10x10{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-10x10{
        width:82.8333333333% !important;
        padding:41.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-10x11{
    width:82.8333333333%;
    padding:45.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-10x11,.blog-post .row:not(:last-of-type) .columns-10x11,.index-blog .row .columns-10x11{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-10x11{
        width:82.8333333333% !important;
        padding:45.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-10x12{
    width:82.8333333333%;
    padding:49.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-10x12,.blog-post .row:not(:last-of-type) .columns-10x12,.index-blog .row .columns-10x12{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-10x12{
        width:82.8333333333% !important;
        padding:49.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-11x1{
    width:91.1666666667%;
    padding:3.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-11x1,.blog-post .row:not(:last-of-type) .columns-11x1,.index-blog .row .columns-11x1{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-11x1{
        width:91.1666666667% !important;
        padding:3.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-11x2{
    width:91.1666666667%;
    padding:7.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-11x2,.blog-post .row:not(:last-of-type) .columns-11x2,.index-blog .row .columns-11x2{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-11x2{
        width:91.1666666667% !important;
        padding:7.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-11x3{
    width:91.1666666667%;
    padding:12.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-11x3,.blog-post .row:not(:last-of-type) .columns-11x3,.index-blog .row .columns-11x3{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-11x3{
        width:91.1666666667% !important;
        padding:12.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-11x4{
    width:91.1666666667%;
    padding:16.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-11x4,.blog-post .row:not(:last-of-type) .columns-11x4,.index-blog .row .columns-11x4{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-11x4{
        width:91.1666666667% !important;
        padding:16.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-11x5{
    width:91.1666666667%;
    padding:20.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-11x5,.blog-post .row:not(:last-of-type) .columns-11x5,.index-blog .row .columns-11x5{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-11x5{
        width:91.1666666667% !important;
        padding:20.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-11x6{
    width:91.1666666667%;
    padding:24.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-11x6,.blog-post .row:not(:last-of-type) .columns-11x6,.index-blog .row .columns-11x6{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-11x6{
        width:91.1666666667% !important;
        padding:24.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-11x7{
    width:91.1666666667%;
    padding:28.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-11x7,.blog-post .row:not(:last-of-type) .columns-11x7,.index-blog .row .columns-11x7{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-11x7{
        width:91.1666666667% !important;
        padding:28.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-11x8{
    width:91.1666666667%;
    padding:32.8383333333% 0
}
@media only screen and (max-width: 680px){.project-page .row:not(:last-of-type) .columns-11x8,.blog-post .row:not(:last-of-type) .columns-11x8,.index-blog .row .columns-11x8{
    width:100%;
    padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-11x8{
        width:91.1666666667% !important;
        padding:32.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-11x9{
    width:91.1666666667%;
    padding:37.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-11x9,.blog-post .row:not(:last-of-type) .columns-11x9,.index-blog .row .columns-11x9{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-11x9{
        width:91.1666666667% !important;
        padding:37.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-11x10{
    width:91.1666666667%;
    padding:41.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-11x10,.blog-post .row:not(:last-of-type) .columns-11x10,.index-blog .row .columns-11x10{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-11x10{
        width:91.1666666667% !important;
        padding:41.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-11x11{
    width:91.1666666667%;
    padding:45.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-11x11,.blog-post .row:not(:last-of-type) .columns-11x11,.index-blog .row .columns-11x11{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-11x11{
        width:91.1666666667% !important;
        padding:45.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-11x12{
    width:91.1666666667%;
    padding:49.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-11x12,.blog-post .row:not(:last-of-type) .columns-11x12,.index-blog .row .columns-11x12{
        width:100%;
        padding:80% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-11x12{
        width:91.1666666667% !important;
        padding:49.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-12x1{
    width:100%;
    padding:3.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-12x1,.blog-post .row:not(:last-of-type) .columns-12x1,.index-blog .row .columns-12x1{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-12x1{
        width:100% !important;
        padding:3.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-12x2{
    width:100%;
    padding:7.8383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-12x2,.blog-post .row:not(:last-of-type) .columns-12x2,.index-blog .row .columns-12x2{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-12x2{
        width:100% !important;
        padding:7.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-12x3{
    width:100%;
    padding:12.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-12x3,.blog-post .row:not(:last-of-type) .columns-12x3,.index-blog .row .columns-12x3{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-12x3{
        width:100% !important;
        padding:12.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-12x4{
    width:100%;
    padding:16.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-12x4,.blog-post .row:not(:last-of-type) .columns-12x4,.index-blog .row .columns-12x4{
        width:100%;
        padding:32% 0
    }
}@media only screen and (max-width: 680px){
    .sm-columns-12x4{
        width:100% !important;
        padding:16.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-12x5{
    width:100%;
    padding:20.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-12x5,.blog-post .row:not(:last-of-type) .columns-12x5,.index-blog .row .columns-12x5{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-12x5{
        width:100% !important;
        padding:20.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-12x6{
    width:100%;
    padding:24.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-12x6,.blog-post .row:not(:last-of-type) .columns-12x6,.index-blog .row .columns-12x6{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-12x6{
        width:100% !important;
        padding:24.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-12x7{
    width:100%;
    padding:28.6716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-12x7,.blog-post .row:not(:last-of-type) .columns-12x7,.index-blog .row .columns-12x7{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-12x7{
        width:100% !important;
        padding:28.6716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-12x8{
    width:100%;
    padding:32.8383333333% 0
}
@media only screen and (max-width: 680px){.project-page .row:not(:last-of-type) .columns-12x8,.blog-post .row:not(:last-of-type) .columns-12x8,.index-blog .row .columns-12x8{
    width:100%;
    padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-12x8{
        width:100% !important;
        padding:32.8383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-12x9{
    width:100%;
    padding:37.005% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-12x9,.blog-post .row:not(:last-of-type) .columns-12x9,.index-blog .row .columns-12x9{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-12x9{
        width:100% !important;
        padding:37.005% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-12x10{
    width:100%;
    padding:41.1716666667% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-12x10,.blog-post .row:not(:last-of-type) .columns-12x10,.index-blog .row .columns-12x10{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-12x10{
        width:100% !important;
        padding:41.1716666667% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-12x11{
    width:100%;
    padding:45.3383333333% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-12x11,.blog-post .row:not(:last-of-type) .columns-12x11,.index-blog .row .columns-12x11{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-12x11{
        width:100% !important;
        padding:45.3383333333% 0 !important
    }
    .sm-none{
        display:none
    }
}
.columns-12x12{
    width:100%;
    padding:49.505% 0
}
@media only screen and (max-width: 680px){
    .project-page .row:not(:last-of-type) .columns-12x12,.blog-post .row:not(:last-of-type) .columns-12x12,.index-blog .row .columns-12x12{
        width:100%;
        padding:32% 0
    }
}
@media only screen and (max-width: 680px){
    .sm-columns-12x12{
        width:100% !important;
        padding:49.505% 0 !important
    }
    .sm-none{
        display:none
    }
}
@media only screen and (max-width: 680px){
    .window{
        display:none
    }
}
@media only screen and (max-width: 680px){
    .lightbox{
        display:none
    }
}
@media only screen and (min-width: 681px){
    .lightbox{
        position:fixed;
        overflow:hidden;
        top:0px;
        left:0px;
        padding:0px;
        z-index:99;
        text-align:center;
        background-color:rgba(0,0,0,.85)
    }
    .lightbox a{
        z-index:2;
        position:absolute;
        top:0;
        bottom:0;
        left:0;
        right:0;
        overflow:hidden;
        opacity:0;
        filter:alpha(opacity=0);
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)"
    }
    .lightbox a img{
        position:absolute;
        max-height:70%;
        top:50%;
        padding:0 4em;
        opacity:0;
        filter:alpha(opacity=0);
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)";
        transform:translate(-50%, -50%)
    }
    .lightbox a.lb-prev img,.lightbox a.lb-next img{
        padding:0 !important
    }
    .lightbox:target{
        width:auto;
        height:auto;
        bottom:0px;
        right:0px
    }
    .lightbox:target img,.lightbox:target a{
        opacity:1;
        filter:alpha(opacity=99);
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=99)"
    }
    .lightbox x:-o-prefocus,.lightbox .lightbox img{
        height:100%
    }
}
.lb-prev{
    position:relative;
    width:50px;
    right:auto;
    left:0
}
.lb-next{
    position:relative;
    width:50px;
    right:0;
    left:auto !important
}
.index-page .phil:not(.colorfill){
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(100));
    filter:grayscale(100%)
}
.index-page .phil:not(.colorfill):hover{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='saturate' values='0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(0));
    filter:grayscale(0%)
}
.index-page .phil:not(.colorfill) a{
    background-color:rgba(0,0,0,.45)
}
.index-page .phil:not(.colorfill) a:hover{
    background-color:rgba(0,0,0,0)
}
.studio-page .hover-yellow{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(100));
    filter:grayscale(100%)
}
.studio-page .hover-yellow:hover{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='saturate' values='0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(0));
    filter:grayscale(0%)
}
.studio-page .hover-yellow a{
    background-color:rgba(0,0,0,.45)
}
.studio-page .hover-yellow a:hover{
    background-color:#ffb808
}
[class*=icon-]{
    position:absolute;
    top:50%;left:0;
    right:0;
    transform:translate(0%, -50%);
    width:100%;
    margin:0 auto;
    background-position:center;
    background-size:cover
}
.icon-sm{
    max-width:12%;
    padding:6% 0
}
aside .icon-sm{
    padding:22%
}
.icon-md{
    max-width:24%;
    padding:12% 0
}
aside .icon-md{
    padding:28%
}
.icon-lg{
    max-width:48%;
    padding:24% 0
}
aside .icon-lg{
    padding:34%
}
.index-page .phil:not(.colorfill) a .icon{
    opacity:0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter:alpha(opacity=0)
}
.index-page .phil:not(.colorfill) a:hover:not(.button) .box{
    opacity:0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter:alpha(opacity=0)
}
.index-page .phil:not(.colorfill) a:hover:not(.button) .icon{
    opacity:1;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter:alpha(opacity=100)
}
@media only screen and (max-width: 680px){
    .window{
        display:none
    }
}
@media only screen and (max-width: 680px){
    .lightbox{
        display:none
    }
}
@media only screen and (min-width: 681px){
    .lightbox{
        position:fixed;
        overflow:hidden;
        top:0px;
        left:0px;
        padding:0px;
        z-index:99;
        text-align:center;
        background-color:rgba(0,0,0,.85)
    }
    .lightbox a{
        z-index:2;
        position:absolute;
        top:0;
        bottom:0;
        left:0;
        right:0;
        overflow:hidden;
        opacity:0;
        filter:alpha(opacity=0);
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)"
    }
    .lightbox a img{
        position:absolute;
        max-height:70%;
        top:50%;
        padding:0 4em;
        opacity:0;
        filter:alpha(opacity=0);
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)";
        transform:translate(-50%, -50%)
    }
    .lightbox a.lb-prev img,.lightbox a.lb-next img{
        padding:0 !important
    }
    .lightbox:target{
        width:auto;
        height:auto;
        bottom:0px;
        right:0px
    }
    .lightbox:target img,.lightbox:target a{
        opacity:1;
        filter:alpha(opacity=99);
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=99)"
    }
    .lightbox x:-o-prefocus,.lightbox .lightbox img{
        height:100%
    }
}
.lb-prev{
    position:relative;
    width:50px;
    right:auto;
    left:0
}
.lb-next{
    position:relative;
    width:50px;
    right:0;
    left:auto !important
}
.index-page .phil:not(.colorfill){
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(100));
    filter:grayscale(100%)
}
.index-page .phil:not(.colorfill):hover{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='saturate' values='0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(0));
    filter:grayscale(0%)
}
.index-page .phil:not(.colorfill) a{
    background-color:rgba(0,0,0,.45)
}
.index-page .phil:not(.colorfill) a:hover{
    background-color:rgba(0,0,0,0)
}
.studio-page .hover-yellow{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(100));
    filter:grayscale(100%)
}
.studio-page .hover-yellow:hover{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='saturate' values='0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(0));
    filter:grayscale(0%)
}
.studio-page .hover-yellow a{
    background-color:rgba(0,0,0,.45)
}
.studio-page .hover-yellow a:hover{
    background-color:#ffb808
}
.garamond{
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
.museo-100{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:100
}
.museo-700{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
.color_black{
    color:#000
}
.color_white{
    color:#fff
}
.color_grey{
    color:#878787
}
.color_yellow{
    color:#ffb808
}
.color_turquoise{
    color:#25484c
}
h1,h2,h3,h4,h5,h6{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
h1,h2{
    font-size:1em;
    color:#fff;
    line-height:1.1em;
    letter-spacing:.094em;
    text-transform:uppercase;
    margin:.65em 0
}
.index-page h1,.index-page h2{
    margin:0
}
@media only screen and (max-width: 680px){
    .index-page h1,.index-page h2{
        font-size:2.38vw;
        line-height:1.25em
    }
}
.index-page.keywords h1,.index-page.keywords h2{
    margin:0;
    text-transform:capitalize;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    color:#fff;
    font-size:1.063em;
    letter-spacing:.05em
}
@media only screen and (max-width: 680px){
    .index-page.keywords h1,.index-page.keywords h2{
        font-size:2.38vw;
        line-height:1.25em
    }
}
@media only screen and (min-width: 1100px){
    .index-page.keywords h1,.index-page.keywords h2{
        font-size:1.0225em
    }
}
h3{
    font-size:1em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:uppercase
}
p,dl,ul{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:100;
    color:#b0b0b0;
    font-size:.8em;
    line-height:1.4em;
    letter-spacing:.094em
}
.index-page.keywords .box p{
    font-family:"museo-sans",sans-serif !important;
    font-style:normal !important;
    font-weight:800 !important;
    font-size:3.25vw !important;
    letter-spacing:.04em !important;
    -webkit-font-smoothing:antialiased !important;
    -moz-osx-font-smoothing:grayscale !important
}
@media only screen and (max-width: 680px){
    .index-page.keywords .box p{
        font-size:3.5vw !important
    }
}
@media only screen and (min-width: 1100px){
    .index-page.keywords .box p{
        font-size:2.25rem !important
    }
}
dl dd a,dl dd a:visited,dl dd a:active{
    color:#b0b0b0;
    text-decoration:none;
    cursor:pointer
}
dl dd a:hover,dl dd a:visited:hover,dl dd a:active:hover{
    color:#ffb808
}
.quote{
    text-align:center
}
.quote q{
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-size:1.25em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:uppercase
}
@media only screen and (min-width: 681px){
    #project-name{
        width:55%
    }
}
@media only screen and (min-width: 681px){
    #project-name{
        width:55%
    }
}
#project-name p{
    list-style:none;
    letter-spacing:.05em;
    line-height:.9em;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    -webkit-font-smoothing:antialiased;
    font-weight:900;
    margin-top:.65rem;
    color:#fff;
    font-size:4.65vw
}
@media only screen and (max-width: 680px){
    #project-name p{
        font-size:8.25vw
    }
}
@media only screen and (min-width: 1100px){
    #project-name p{
        font-size:3.225rem
    }
}
.related-projects .next{
    float:right
}
.related-projects .next,.related-projects .prev{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(100));
    filter:grayscale(100%)
}
.related-projects .next:hover,.related-projects .prev:hover{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='saturate' values='0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(0));
    filter:grayscale(0%)
}
.related-projects .next a,.related-projects .prev a{
    background-color:rgba(135,135,135,.65)
}
.related-projects .next a:hover,.related-projects .prev a:hover{
    background-color:#000;
    opacity:0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter:alpha(opacity=0)
}
.related-projects .next a p,.related-projects .prev a p{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-transform:uppercase
}
@media only screen and (min-width: 681px){
    .related-projects .next br,.related-projects .prev br{
        display:none
    }
}
.button{
    border:1px solid #343434
}
.button:hover{
    background-color:#343434
}
.button p{
    font-family:"museo-sans",sans-serif !important;
    font-style:normal !important;
    font-weight:300 !important;
    font-size:1em !important;
    color:#fff !important
}
@media only screen and (max-width: 680px){
    .button{
        margin-top:4%
    }
}
.press-page .row a{
    position:relative
}
.press-page .row .phil{
    padding:0 !important
}
.press-page .row h1{
    background-color:#333;
    text-align:center;
    padding:1% 0;
    margin-bottom:2%;
    clear:both
}
@media only screen and (max-width: 680px){
    .press-page .row h1{
        margin-top:.5%
    }
}
.press-page .row h2{
    margin-bottom:0;
    font-size:1.74vw;
    margin-top:2%;
    text-align:center
}
@media only screen and (min-width: 1100px){
    .press-page .row h2{
        font-size:1.2em
    }
}
@media only screen and (max-width: 680px){
    .press-page .row h2{
        font-size:3.4vw
    }
}
@media only screen and (max-width: 375px){
    .press-page .row h2{
        font-size:3vw
    }
}
.press-page .row .two{
    margin-left:.67%;
    margin-right:.67%
}
@media only screen and (max-width: 680px){
    .press-page .row .two{
        float:right;
        margin-left:0;
        margin-right:0
    }
}
@media only screen and (max-width: 680px){
    .press-page .row .three{
        float:left;
        clear:both
    }
}
.press-page .row p{
    margin-bottom:2%
}
@media only screen and (max-width: 680px){
    .press-page .row p{
        text-align:center
    }
}
.press-page .row .issue{
    display:block;
    color:#878787;
    font-size:1.85vw;
    line-height:1em;
    text-align:center !important;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
@media only screen and (min-width: 1100px){
    .press-page .row .issue{
        font-size:1.25em
    }
}
@media only screen and (max-width: 680px){
    .press-page .row .issue{
        font-size:3.5vw
    }
}
@media only screen and (max-width: 375px){
    .press-page .row .issue{
        font-size:4vw
    }
}
.press-page .row.print p:not(.issue),.press-page .row.press p:not(.issue){
    border-top:1px solid #878787;
    padding-top:4%;
    margin-top:4%
}
.brandGuide header p{
    margin-top:4%
}
.brandGuide header,.brandGuide .section{
    width:100%;
    display:inline-block
}
.brandGuide header:first-child,.brandGuide .section:first-child{
    margin-top:10%;
    margin-bottom:5%
}
@media only screen and (max-width: 680px){
    .brandGuide header:first-child,.brandGuide .section:first-child{
        margin-top:15%
    }
}
.brandGuide header:not(:first-child),.brandGuide .section:not(:first-child){
    padding:5% 0;
    border-top:1px solid #b0b0b0
}
.brandGuide header .row,.brandGuide .section .row{
    width:49.5%
}
@media only screen and (max-width: 680px){
    .brandGuide header .row,.brandGuide .section .row{
        width:100% !important;
        float:left !important
    }
}
@media only screen and (max-width: 680px){
    .brandGuide header .copywrite,.brandGuide .section .copywrite{
        padding:0 !important
    }
}
.brandGuide h1{
    font-family:"Montserrat Bold",sans-serif;
    font-size:3.85em;
    text-transform:none;
    line-height:.95em;
    margin:0
}
@media only screen and (max-width: 680px){
    .brandGuide h1{
        font-size:2.25em
    }
}
@media only screen and (max-width: 375px){
    .brandGuide h1{
        font-size:8vw
    }
}
.brandGuide h1 span{
    display:block;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-size:.5em;
    letter-spacing:.05em;
    color:#b0b0b0
}
.brandGuide h1 span a{
    color:#b0b0b0
}
.brandGuide .errorMessage{
    font-family:"Montserrat Bold",sans-serif;
    font-size:2.85em;
    text-transform:none;
    font-style:normal;
    line-height:.95em;
    margin:0
}
@media only screen and (max-width: 680px){
    .brandGuide .errorMessage{
        font-size:1.75em
    }
}
@media only screen and (max-width: 375px){
    .brandGuide .errorMessage{
        font-size:6.5vw
    }
}
.brandGuide p{
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    color:#b0b0b0;font-size:1.1em
}
@media only screen and (max-width: 680px){
    .brandGuide p{
        padding:0 !important
    }
}
.brandGuide img{
    position:absolute;
    max-width:75%;
    width:auto;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%)
}
.brandGuide .btn{
    background-color:#000;
    border:2px solid #b0b0b0;
    margin:5% 0
}
@media only screen and (min-width: 681px){
    .brandGuide .btn:hover{
        background-color:#fff
    }
}
.brandGuide .btn a span{
    position:absolute;
    width:100%;
    top:50%;
    transform:translate(0, -50%);
    font-family:"Montserrat Bold",sans-serif;
    text-transform:none;
    font-size:1.85em;
    color:#b0b0b0;
    line-height:1.4em;
    letter-spacing:.094em;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-align:center
}
@media only screen and (max-width: 680px){
    .brandGuide .btn a span{
        font-size:1.8em
    }
}
@media only screen and (max-width: 375px){
    .brandGuide .btn a span{font-size:6.5vw
    }
}
.brandGuide .file{
    background-color:#aaa;
    margin:.4% 0
}
.brandGuide .file p{
    top:6%;
    font-size:.85em
}
@media only screen and (max-width: 680px){
    .brandGuide .file p{
        font-size:1.95vw
    }
}
.brandGuide .file a:hover{
    background-color:#fff
}
.brandGuide .file a:hover p{
    color:#aaa
}
@media only screen and (max-width: 375px){
    .brandGuide .br{
        display:none
    }
}
.brandGuide .left{
    float:left
}
.brandGuide .right{
    float:right;
    clear:right
}
@font-face{
    font-family:"Montserrat Black";
    src:url("../fonts/Montserrat-Black.otf") format("opentype")
}
@font-face{
    font-family:"Montserrat Bold";
    src:url("../fonts/Montserrat-Bold.otf") format("opentype")
}
@font-face{
    font-family:"Montserrat Extra Bold";
    src:url("../fonts/Montserrat-ExtraBold.otf") format("opentype")
}
@font-face{
    font-family:"Montserrat Extra Light";
    src:url("../fonts/Montserrat-ExtraLight.otf") format("opentype")
}
@font-face{
    font-family:"Montserrat Light";
    src:url("../fonts/Montserrat-Light.otf") format("opentype")
}
@font-face{
    font-family:"Montserrat Medium";
    src:url("../fonts/Montserrat-Medium.otf") format("opentype")
}
@font-face{
    font-family:"Montserrat Regular";
    src:url("../fonts/Montserrat-Regular.otf") format("opentype")
}
@font-face{font-family:"Montserrat SemiBold";
    src:url("../fonts/Montserrat-SemiBold.otf") format("opentype")
}
@font-face{font-family:"Montserrat Thin";
    src:url("../fonts/Montserrat-Thin.otf") format("opentype")
}
@font-face{font-family:"Montserrat UltraLight";
    src:url("../fonts/Montserrat-UltraLight.otf") format("opentype")
}
.contact-page .contact-info{
    color:#ffb808
}
.contact-page .contact-info a{
    color:#ffb808
}
.contact-page .contact-col-title{
    margin-bottom:1em
}
@media only screen and (max-width: 680px){
    .contact-page .contact-col-title{
        margin-bottom:3.5%
    }
}
.contact-page .contact-info .copyWR{
    padding:1.25em 0;
    margin-bottom:4%
}
.contact-page .contact-info .brand{
    margin-bottom:6%
}
.contact-page .contact-info .brand img{
    margin:2% auto;
    width:50px !important
}
.contact-page .contact-info address{
    margin-bottom:6%;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-size:1.063em;
    line-height:1em;
    letter-spacing:.05em
}
.contact-page .contact-info .social{
    font-size:0;
    margin-bottom:2%
}
.contact-page .contact-info .social a{
    width:25px;
    margin:0 1%;
    display:inline-block
}
.contact-page .contact-info .email-phone a{
    margin-bottom:6%;
    display:block;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-size:1.063em;
    line-height:1em;
    letter-spacing:.05em
}
.contact-page .hide{
    display:none !important
}
.contact-page form h2{
    margin:.2em 0
}
.contact-page form #cost-per-sf span{
    color:#ffb808
}
.contact-page form label{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    font-size:1em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:uppercase;
    -webkit-font-smoothing:antialiased;
    -webkit-user-select:none;
    -moz-user-select:none;
    -khtml-user-select:none;
    -ms-user-select:none
}
@media only screen and (max-width: 680px){
    .contact-page form label{
        font-size:3.5vw !important
    }
}
.contact-page form input[type=radio],.contact-page form input[type=checkbox]{
    display:none
}
.contact-page form input[type=text],.contact-page form input[type=email],.contact-page form input[type=phone]{
    border:1px #878787 solid;
    padding:.3em;
    width:100%
}
.contact-page form input,.contact-page form input:active,.contact-page form input:focus,.contact-page form input:hover{
    outline:none;
    -webkit-appearance:none
}
.contact-page form input[type=range]{
    margin:10px 0;
    width:100%
}
.contact-page form input[type=range]::-webkit-slider-runnable-track{
    width:100%;
    height:5px;
    cursor:pointer;
    animate:.2s;
    background:#878787;
    border-radius:10px
}
.contact-page form input[type=range]:focus::-webkit-slider-runnable-track{
    background:#878787
}
.contact-page form input[type=range]::-moz-range-track{
    width:100%;
    height:5px;
    cursor:pointer;
    animate:.2s;
    background:#878787;
    border-radius:10px;
    margin-bottom:.5em
}
.contact-page form input[type=range]::-ms-track{
    width:100%;
    height:5px;
    cursor:pointer;
    animate:.2s;
    background:#878787;
    border-radius:10px;
    margin-bottom:.5em
}
.contact-page form input[type=range]::-webkit-slider-thumb{
    height:20px;
    width:20px;
    border:none;
    border-radius:50%;
    background:#ffb808;
    cursor:pointer;
    -webkit-appearance:none;
    margin-top:-8px
}
.contact-page form input[type=range]::-moz-range-thumb{
    height:20px;
    width:20px;
    border:none;
    border-radius:50%;
    background:#ffb808;
    cursor:pointer;
    -webkit-appearance:none;
    margin-top:-8px
}
.contact-page form input[type=range]::-ms-fill-lower{
    border:none;
    border-radius:50%;
    background:#878787
}
.contact-page form input[type=range]::-ms-fill-upper{
    border:none;
    border-radius:50%;
    background:#878787
}
.contact-page form input[type=range]::-ms-thumb{
    height:20px;
    width:20px;
    border:none;
    border-radius:50%;
    background:#ffb808;
    cursor:pointer;
    -webkit-appearance:none;
    margin-top:-8px
}
.contact-page form input[type=range]:focus::-ms-fill-lower{
    background:#878787
}
.contact-page form input[type=range]:focus::-ms-fill-upper{
    background:#878787
}
.contact-page form .user-contact label{
    display:block
}
.contact-page form input[type=radio]+label,.contact-page form input[type=checkbox]+label,.contact-page form #budgetOutput,.contact-page form #squarefootageOutput{
    display:inline-block;
    cursor:pointer;
    background-color:#b0b0b0;
    margin:.1em 0;
    padding:.6em;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    font-size:1em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:uppercase;
    -webkit-font-smoothing:antialiased
}
.contact-page form .checked{
    background-color:#ffb808 !important
}
.contact-page form input:checked+label{
    color:#fff;
    background-color:#ffb808
}
.contact-page form #interest,.contact-page form #service,.contact-page form #type,.contact-page form #budget,.contact-page form #spaces,.contact-page form #square-footage,.contact-page form .user-contact,.contact-page form #cost-per-sf{
    border-top:1px solid #878787;
    padding:1em 0
}
.contact-page form .user-contact input{
    margin:0 .3em .5em 0;
    padding:.3em;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    font-size:1em;
    line-height:1.4em;
    letter-spacing:.094em;
    -webkit-font-smoothing:antialiased
}
.contact-page form input[type=submit],.contact-page form input[type=submit]:active,.contact-page form input[type=submit]:focus{
    border:0;
    width:100%;
    padding:.3em 0;
    cursor:pointer;
    background:#ffb808;
    color:#fff;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    font-size:1em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:uppercase;
    -webkit-font-smoothing:antialiased
}
.contact-page form input[type=submit]:hover{
    background:rgba(255,184,8,.5)
}
.contact-page form output{
    cursor:default !important
}
.contact-page form #budget h2,.contact-page form #square-footage h2{
    display:inline-block
}
.contact-page form #budget h2:nth-of-type(2),.contact-page form #square-footage h2:nth-of-type(2){
    color:#878787
}
@media only screen and (min-width: 681px){
    .client-info .question{
        display:flex;
        align-items:baseline;
        margin:1rem 0
    }
}
.client-info input,.client-info textarea{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    font-size:1em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    -webkit-font-smoothing:antialiased;
    border-radius:0
}
@media only screen and (max-width: 680px){
    .client-info .question{
        margin:1rem 0
    }
}
@media only screen and (max-width: 680px){
    .client-info label,.client-info input{
        width:100%;
        display:block
    }
}
.client-info .question input{
    background:none;
    border:none;
    border-bottom:1px solid #fff;
    outline:none;
    color:#fff;
    flex:1
}
@media only screen and (min-width: 681px){
    .client-info .flex{
        display:flex;
        margin:0
    }
    .client-info .mailing-state{
        flex:1 0 20px;
        margin-right:.5rem
    }
    .client-info .mailing-state,.client-info .mailing-zip,.client-info .phone-number,.client-info .email-address{
        margin-top:0;
        margin-bottom:0
    }
    .client-info .phone-number,.client-info .email-address{
        flex:1
    }
    .client-info .email-address{
        margin-right:.5rem
    }
}
.client-info input[type=radio]{
    display:none
}
.client-info input[type=radio]:checked+label{
    color:#ffb808
}
.client-info label{
    margin-right:.5rem;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    font-size:1em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:uppercase;
    -webkit-font-smoothing:antialiased
}
.client-info .form-header{
    text-align:center;
    margin-bottom:2rem
}
.client-info .form-header h2{
    margin-bottom:0
}
.client-info .form-header p{
    margin-bottom:1rem
}
.client-info #project-notes{
    display:block
}
.client-info textarea{
    width:100%;
    display:block;
    resize:none;
    border:1px solid #fff;
    outline:none;
    color:#fff;
    background-color:#000
}
@media only screen and (max-width: 680px){
    .client-info #how-client-found-us label,.client-info #project-type label{
        margin:1rem 0;
        display:block
    }
}
.client-info #how-client-found-us,.client-info #project-type,.client-info .section-label{
    display:block
}
.client-info #project-info .form-header{
    margin:2rem
}
.client-info #how-client-found-us label:not(.section-label),.client-info #project-type label:not(.section-label){
    width:auto;
    display:inline-block;
    cursor:pointer;
    background-color:#b0b0b0;
    margin:.16em .05em;
    padding:.6em;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    font-size:1em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:uppercase;
    -webkit-font-smoothing:antialiased
}
.client-info #how-client-found-us input:checked+label,.client-info #project-type input:checked+label{
    color:#fff;
    background-color:#ffb808
}
.client-info .submit{
    background:#ffb808
}
.client-info .submit:hover{
    background:rgba(255,184,8,.5)
}
.client-info input[type=submit],.client-info input[type=submit]:active,.client-info input[type=submit]:focus,.client-info input[type=submit]:hover{
    border:0;
    width:100%;
    padding:.3em 0;
    cursor:pointer;
    background:none;
    color:#fff;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    font-size:1em;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:uppercase;
    -webkit-font-smoothing:antialiased
}
.welcome__list__item__link:active,.welcome__list__item:last-child a:active,.welcome__list__item__link:visited,.welcome__list__item:last-child a:visited{
    color:#fff
}
.welcome__list__item__link:hover,.welcome__list__item:last-child a:hover{
    color:#ffb808
}
@media only screen and (min-device-width: 375px)and (max-device-width: 667px)and (-webkit-min-device-pixel-ratio: 2){.welcome__list__item__link:hover,.welcome__list__item:last-child a:hover,.welcome__list__item__link:active,.welcome__list__item:last-child a:active,.welcome__list__item__link:visited,.welcome__list__item:last-child a:visited{
    color:#fff
    }
}
@media only screen and (min-device-width: 768px)and (max-device-width: 1024px)and (-webkit-min-device-pixel-ratio: 1){.welcome__list__item__link:hover,.welcome__list__item:last-child a:hover,.welcome__list__item__link:active,.welcome__list__item:last-child a:active,.welcome__list__item__link:visited,.welcome__list__item:last-child a:visited{
    color:#fff
    }
}
.welcome{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background:#000;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    transition:transform 750ms ease-in-out;
    z-index:999;
    background-size:cover;
    background-position:center
}
.welcome--active{
    transform:translateY(-100%)
}
.welcome__list{
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    list-style:none;
    letter-spacing:.05em;
    line-height:.9em;
    color:#fff;
    text-align:left;
    font-weight:900;
    font-size:8vw
}
.welcome__list::after{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-color:#000;
    opacity:.6;
    z-index:-1
}
@media only screen and (max-width: 680px){
    .welcome__list{
        font-size:9.8vw
    }
}
.welcome__list__item:last-child{
    display:inline;
    letter-spacing:.02em;
    line-height:1.1em;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-size:2.7vw;
    vertical-align:1.4em
}
@media only screen and (max-width: 680px){
    .welcome__list__item:last-child{
        font-size:5.6vw
    }
}
.welcome__list__item:last-child a{
    color:#fff
}
.welcome__list__item__link{
    text-decoration:none;
    text-transform:capitalize;
    color:#fff;
    cursor:pointer
}
.welcome .fa-angle-down{
    color:#fff;
    font-size:4vw;
    animation:updown 2s ease infinite
}
@media only screen and (max-width: 680px){
    .welcome .fa-angle-down{
        font-size:9.8vw
    }
}
@keyframes updown{
    0%{
        transform:translateY(-20%)
    }
    50%{
        transform:translateY(20%)
    }
    100%{
        transform:translateY(-20%)
    }
}
.estimate-page #arch-construction-fees,.estimate-page #int-construction-fees,.estimate-page #con-construction-fees,.estimate-page #arch-service-fees,.estimate-page #int-service-fees,.estimate-page #con-service-fees,.estimate-page #total-development{
    display:none
}
.estimate-page #estimate-generator span{
    color:#ffb808
}
.estimate-page .wrapper .header-box{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center
}
.estimate-page .wrapper .header-box p{
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    color:#ffb808;
    font-size:1.063em;
    line-height:1em;
    letter-spacing:.05em
}
@media only screen and (max-width: 680px){
    .estimate-page .wrapper .header-box h1{
        font-size:5vw
    }
}
@media only screen and (min-width: 681px){
    .estimate-page .wrapper .header-box h1{
        font-size:1.5rem
    }
}
.estimate-page form input{
    margin:0;
    padding:.3em;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    font-size:1em;
    line-height:1.4em;
    letter-spacing:.094em;
    -webkit-font-smoothing:antialiased
}
.estimate-page form input[type=text]:not(#name){
    width:7rem;
    text-align:center;
    align-self:flex-end
}
.estimate-page form input[type=range]{
    background:none;
    padding-left:0;
    padding-right:0
}
.estimate-page form input[type=range]::-webkit-slider-runnable-track{
    width:100%;
    height:5px;
    cursor:pointer;
    background:#fff !important;
    border-radius:10px
}
.estimate-page form p:not(:last-of-type){
    margin-bottom:1rem
}
.estimate-page form h2{
    margin-bottom:1rem;
    padding-bottom:1rem;
    border-bottom:solid #aaa 1px
}
.estimate-page form h3{
    text-transform:none;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased
}
.estimate-page form .flex-container{
    display:flex
}
@media only screen and (max-width: 680px){
    .estimate-page form .flex-container{
        flex-direction:column
    }
}
.estimate-page form .flex-container .box{
    margin-bottom:1rem
}
.estimate-page form .flex-container .box:first-of-type{
    margin-right:1rem
}
@media only screen and (max-width: 680px){
    .estimate-page form .flex-container .box:nth-child(1){
        order:2
    }
    .estimate-page form .flex-container .box:nth-child(2){
        order:1
    }
}
@media only screen and (min-width: 681px){
    .estimate-page form .flex-container .box{
        width:50%
    }
}
.estimate-page form .flex-container .box .underline{
    padding-bottom:1rem;
    border-bottom:solid #aaa 1px
}
.estimate-page form .flex-container .box .underline:not(:first-of-type){
    margin-top:1rem
}
@media only screen and (max-width: 680px){
    .estimate-page #contact #name{
        margin-bottom:.25rem
    }
}
@media only screen and (min-width: 681px){
    .estimate-page #contact #name{
        margin-right:1rem
    }
}
.estimate-page .temp{
    display:flex;
    justify-content:space-between
}
@media only screen and (min-width: 681px){
    .estimate-page .temp-contact{
        display:flex;
        justify-content:space-between
    }
    .estimate-page .temp-contact input{
        width:50% !important
    }
}
.estimate-page section:not(#total-development-costs){
    margin-bottom:5rem
}
.estimate-page section#acquisition-costs{
    margin-top:5rem
}
.estimate-page #submit{
    margin-top:1rem
}
.estimate-page .output-brick{
    background-color:#b0b0b0;
    margin:.1em 0;
    padding:.6em;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    font-size:1em;
    color:#fff !important;
    line-height:1.4em;
    letter-spacing:.094em;
    -webkit-font-smoothing:antialiased;
    width:7rem;
    text-align:center;
    align-self:flex-end
}
.estimate-page .fields{
    display:flex;
    flex-direction:column
}
.estimate-page .fields-row{
    display:flex;
    flex-direction:row;
    justify-content:space-between
}
.estimate-page #total-development-costs .flex-container{
    justify-content:flex-end
}
.estimate-page #total-development-costs .flex-container .box{
    margin-right:0
}
.estimate-page #total-development-generated{
    font-size:1em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:uppercase;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    align-self:flex-end
}
@media only screen and (max-width: 680px){
    footer.cost-calc-footer{
        margin-bottom:11.5%
    }
}
#total-development-costs-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    position:fixed;
    bottom:calc(56px - .85vw);
    left:5%;
    right:5%;
    max-width:1150px;
    min-height:56px;
    width:90%;
    height:3.5em;
    margin:0 auto;
    padding:0 2%;
    z-index:1;
    background:#ffb808;
    border-top:.85vw solid #000;
    border-bottom:.85vw solid #000;
    transform:translateX(0%)
}
@media only screen and (min-width: 1100px){
    #total-development-costs-footer{
        border-top:.65em solid #000;
        border-bottom:.65em solid #000;
        height:3.5em
    }
}
@media only screen and (max-width: 680px){
    #total-development-costs-footer{
        bottom:0
    }
}
#sqft-calculator{
    margin-bottom:5%
}
#sqft-calculator .questions{
    padding:6rem 0
}
@media only screen and (max-width: 680px){
    #sqft-calculator .questions{
        padding:2rem 0
    }
}
#sqft-calculator .fields{
    display:flex;
    justify-content:space-between
}
@media only screen and (min-width: 681px){
    #sqft-calculator .fields{
        flex-direction:row
    }
}
#sqft-calculator .fields.underline{
    padding:1.5rem 0;
    border-bottom:solid #aaa 1px
}
#sqft-calculator h3{
    font-size:1em;
    color:#fff;
    line-height:1.4em;
    letter-spacing:.094em;
    text-transform:capitalize;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    width:10rem
}
@media only screen and (max-width: 680px){
    #sqft-calculator h3{
        width:100%
    }
}
#sqft-calculator h3 span{
    text-transform:none;
    font-family:"Garamond";
    font-style:italic;
    font-weight:100;
    -webkit-font-smoothing:antialiased
}
#sqft-calculator .io{
    width:70%;
    display:flex;
    flex-direction:column;
    justify-content:flex-end
}
@media only screen and (max-width: 680px){
    #sqft-calculator .io{
        width:100%
    }
}
#sqft-calculator .output-brick{
    background-color:#b0b0b0;
    margin:.1em 0;
    padding:.6em;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    font-size:1em;
    color:#fff !important;
    line-height:1.4em;
    letter-spacing:.094em;
    -webkit-font-smoothing:antialiased;
    width:10rem;
    text-align:center;
    align-self:flex-end
}
#sqft-calculator #additional-spaces,#sqft-calculator #size-of-space{
    width:70%;
    display:flex;
    flex-wrap:wrap;
    margin-left:auto
}
@media only screen and (max-width: 680px){
    #sqft-calculator #additional-spaces,#sqft-calculator #size-of-space{
        width:100%;
        margin:1.5rem 0 0
    }
}
#sqft-calculator #additional-spaces label,#sqft-calculator #size-of-space label{
    display:flex;
    flex:1 0 31%;
    justify-content:center;
    align-items:center;
    text-align:center
}
@media only screen and (max-width: 680px){
    #sqft-calculator #additional-spaces label,#sqft-calculator #size-of-space label{
        flex:1 0 25%
    }
}
@media only screen and (min-width: 681px){
    #sqft-calculator #additional-spaces label,#sqft-calculator #size-of-space label{
        margin:0 0 .5rem .5rem
    }
}
@media only screen and (max-width: 680px){
    #sqft-calculator #additional-spaces label,#sqft-calculator #size-of-space label{
        margin:0 0 .25rem 0
    }
    #sqft-calculator #additional-spaces label:nth-of-type(3n-1),#sqft-calculator #size-of-space label:nth-of-type(3n-1){
        margin:0 .25rem .25rem
    }
}
#sqft-calculator #total-square-footage{
    font-size:2.5rem;
    color:#ffb808;
    text-transform:uppercase;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased;
    align-self:flex-end
}
#sqft-calculator #total-square-footage-input{
    display:none
}
#sqft-calculator #sqft-contact{
    display:flex;
    justify-content:space-between
}
@media only screen and (max-width: 680px){
    #sqft-calculator #sqft-contact{
        flex-direction:column
    }
}
#sqft-calculator #sqft-contact #submit-info,#sqft-calculator #sqft-contact #to-cost-calculator{
    display:flex;
    flex-direction:column
}
@media only screen and (min-width: 681px){
    #sqft-calculator #sqft-contact #submit-info,#sqft-calculator #sqft-contact #to-cost-calculator{
        width:48%
    }
}
#sqft-calculator #sqft-contact #submit-info header,#sqft-calculator #sqft-contact #to-cost-calculator header{
    width:100%;
    padding-bottom:1rem;
    border-bottom:solid #aaa 1px;
    margin-bottom:1.5rem
}
#sqft-calculator #sqft-contact #submit-info h3,#sqft-calculator #sqft-contact #to-cost-calculator h3{
    width:100%;
    text-transform:uppercase;
    padding-bottom:.25rem
}
#sqft-calculator #sqft-contact #submit-info h3 span,#sqft-calculator #sqft-contact #to-cost-calculator h3 span{
    font-size:1em;
    color:#ffb808;
    text-transform:uppercase;
    font-family:"museo-sans",sans-serif;
    font-style:normal;
    font-weight:700;
    -webkit-font-smoothing:antialiased
}
#sqft-calculator #sqft-contact #submit-info p,#sqft-calculator #sqft-contact #to-cost-calculator p{
    width:100%
}
#sqft-calculator #sqft-contact #submit-info .sec,#sqft-calculator #sqft-contact #to-cost-calculator .sec{
    height:100%;
    min-height:200px
}
@media only screen and (max-width: 680px){
    #sqft-calculator #sqft-contact #submit-info{
        margin-bottom:1rem}}#sqft-calculator #sqft-contact #submit-info .sec{
            display:flex;
            flex-direction:column;
            justify-content:space-between
}
#sqft-calculator #sqft-contact #submit-info #submit{
    padding-top:20px;
    padding-bottom:20px;
    margin:0
}
#sqft-calculator #sqft-contact #to-cost-calculator .sec{
    position:relative;
    background:#777;
    display:flex
}
#sqft-calculator #sqft-contact #to-cost-calculator .sec:hover{
    background:rgba(119,119,119,.6)
}
#sqft-calculator #sqft-contact #to-cost-calculator .sec a{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0
}
#sqft-calculator #sqft-contact #to-cost-calculator .sec a div{
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    height:100%;
    width:100%
}
#sqft-calculator #sqft-contact #to-cost-calculator .sec a div h3{
    text-transform:uppercase
}
#sqft-calculator #square-footage-total h2{
    margin:0
}#sqft-calculator #square-footage-total .fields{
    padding-top:1rem
}
#sqft-calculator #square-footage-total .fields p{
    padding-bottom:2rem
}
@media only screen and (min-width: 681px){
    #sqft-calculator #square-footage-total .fields p{
        width:35%
    }
}
@media only screen and (max-width: 680px){
    .window{
        display:none
    }
}
@media only screen and (max-width: 680px){
    .lightbox{
        display:none
    }
}
@media only screen and (min-width: 681px){
    .lightbox{
        position:fixed;
        overflow:hidden;
        top:0px;
        left:0px;
        padding:0px;
        z-index:99;
        text-align:center;
        background-color:rgba(0,0,0,.85)
    }
    .lightbox a{
        z-index:2;
        position:absolute;
        top:0;
        bottom:0;
        left:0;
        right:0;
        overflow:hidden;
        opacity:0;
        filter:alpha(opacity=0);
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)"
    }
    .lightbox a img{
        position:absolute;
        max-height:70%;
        top:50%;
        padding:0 4em;
        opacity:0;
        filter:alpha(opacity=0);
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)";
        transform:translate(-50%, -50%)
    }
    .lightbox a.lb-prev img,.lightbox a.lb-next img{
        padding:0 !important
    }
    .lightbox:target{
        width:auto;
        height:auto;
        bottom:0px;
        right:0px
    }
    .lightbox:target img,.lightbox:target a{
        opacity:1;filter:alpha(opacity=99);
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=99)"
    }
    .lightbox x:-o-prefocus,.lightbox .lightbox img{
        height:100%
    }
}
.lb-prev{
    position:relative;
    width:50px;
    right:auto;
    left:0
}
.lb-next{
    position:relative;
    width:50px;
    right:0;
    left:auto !important
}
.index-page .phil:not(.colorfill){
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(100));
    filter:grayscale(100%)
}
.index-page .phil:not(.colorfill):hover{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='saturate' values='0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(0));
    filter:grayscale(0%)
}
.index-page .phil:not(.colorfill) a{
    background-color:rgba(0,0,0,.45)
}
.index-page .phil:not(.colorfill) a:hover{
    background-color:rgba(0,0,0,0)
}
.studio-page .hover-yellow{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(100));
    filter:grayscale(100%)
}
.studio-page .hover-yellow:hover{
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='saturate' values='0'/></filter></svg>#grayscale");
    filter:gray alpha(opacity=round(0));
    filter:grayscale(0%)
}
.studio-page .hover-yellow a{
    background-color:rgba(0,0,0,.45)
}
.studio-page .hover-yellow a:hover{
    background-color:#ffb808
}
[class*=icon-]{
    position:absolute;
    top:50%;
    left:0;
    right:0;
    transform:translate(0%, -50%);
    width:100%;
    margin:0 auto;
    background-position:center;
    background-size:cover
}
.icon-sm{
    max-width:12%;
    padding:6% 0
}
aside .icon-sm{
    padding:22%
}
.icon-md{
    max-width:24%;
    padding:12% 0
}
aside .icon-md{
    padding:28%
}
.icon-lg{
    max-width:48%;
    padding:24% 0
}
aside .icon-lg{
    padding:34%
}
.index-page .phil:not(.colorfill) a .icon{
    opacity:0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter:alpha(opacity=0)
}
.index-page .phil:not(.colorfill) a:hover:not(.button) .box{
    opacity:0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter:alpha(opacity=0)
}
.index-page .phil:not(.colorfill) a:hover:not(.button) .icon{
    opacity:1;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter:alpha(opacity=100)
}
.space-1 {
    width: 100%;
    height: 1px;
}
.space-2 {
    width: 100%;
    height: 2px;
}
.space-5 {
    width: 100%;
    height: 5px;
}
.space-10 {
    width: 100%;
    height: 10px;
}
.space-20 {
    width: 100%;
    height: 20px;
}
.space-25 {
    width: 100%;
    height: 25px;
}
.space-30 {
    width: 100%;
    height: 30px;
}
.space-40 {
    width: 100%;
    height: 40px;
}
.space-50 {
    width: 100%;
    height: 50px;
}
.space-60 {
    width: 100%;
    height: 60px;
}
.space-70 {
    width: 100%;
    height: 70px;
}
.space-80 {
    width: 100%;
    height: 80px;
}
.space-90 {
    width: 100%;
    height: 90px;
}
.space-100 {
    width: 100%;
    height: 100px;
}
.space-110 {
    width: 100%;
    height: 110px;
}
.space-120 {
    width: 100%;
    height: 120px;
}
.space-130 {
    width: 100%;
    height: 130px;
}
.space-140 {
    width: 100%;
    height: 140px;
}
.space-150 {
    width: 100%;
    height: 150px;
}
.space-55 {
    width: 100%;
    height: 55px;
}
/*# sourceMappingURL=style.css.map */