@import url("//hello.myfonts.net/count/2ede75");

@font-face {
	font-family: 'StandardSerif';
	src: url('/fonts/StandardSerif-LightItalic.eot');
	src: url('/fonts/StandardSerif-LightItalic.eot?#iefix') format('embedded-opentype'),
		url('/fonts/StandardSerif-LightItalic.woff') format('woff'),
		url('/fonts/StandardSerif-LightItalic.ttf')  format('truetype');
	font-weight: 300;
	font-style: italic;
}
@font-face {
	font-family: 'StandardSerif';
	src: url('/fonts/StandardSerif/StandardSerif-Light.eot');
	src: url('/fonts/StandardSerif/StandardSerif-Light.eot?#iefix') format('embedded-opentype'),
		url('/fonts/StandardSerif/StandardSerif-Light.woff') format('woff'),
		url('/fonts/StandardSerif/StandardSerif-Light.ttf')  format('truetype');
	font-weight: 300;
	font-style: normal;
}
@font-face {
    font-family: 'NHaasGroteskTXPro-65Md';
    src: url('/fonts/2EDE75_0_0.eot');
    src:    url('/fonts/2EDE75_0_0.eot?#iefix') format('embedded-opentype'),
            url('/fonts/2EDE75_0_0.woff2') format('woff2'),
            url('/fonts/2EDE75_0_0.woff') format('woff'),
            url('/fonts/2EDE75_0_0.ttf') format('truetype'),
            url('/fonts/2EDE75_0_0.svg#wf') format('svg');
}
@font-face {
    font-family: 'StandardGrotesk-Regular';
    src:    url('/fonts/StandardGrotesk-Regular/StandardGrotesk-Regular.eot?#iefix') format('embedded-opentype'),
            url('/fonts/StandardGrotesk-Regular/StandardGrotesk-Regular.woff') format('woff'),
            url('/fonts/StandardGrotesk-Regular/StandardGrotesk-Regular.ttf') format('truetype'),
            url('/fonts/StandardGrotesk-Regular/StandardGrotesk-Regular.svg#StandardGrotesk-Regular') format('svg');
}

 

::selection {           background: #dadada; }
::-moz-selection {      background: #dadada; }

#main {                 height: auto; z-index: 5; overflow-x: hidden }
.logo {                 height: 1.7vw; margin-top: 0.3vw}
header {                position: fixed; top: 0; padding: 1.098vw 0 0 2.1961vw; font-size: 0; width: 100vw; box-sizing: border-box; height: 4.5783vw; z-index: 10; 
                        background-color: white; overflow: hidden; }

h1 {                    font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 2vw; line-height: 2.2vw; margin: 0; padding: 0; font-weight: normal }
h2 {                    font-family: 'StandardSerif', "WTC Our Bodoni", 'Bodoni MT', 'Times New Roman', serif; font-weight: 300; font-size: 2vw; line-height: 2.2vw; color: black; font-style: italic; margin: 0; }
p {                     font-family: 'StandardSerif', "WTC Our Bodoni", 'Bodoni MT', 'Times New Roman', serif; font-weight: 300; font-size: 0.95vw; line-height: 1.1vw; letter-spacing: 0.01ex; margin: 0 }
hr {                    position: absolute; width: 100%; margin: 0; padding: 0; border: 0; /*border-top: 0.87vw black solid*/ border-top: 3px black solid }
nav {                   display: none }
a {                     text-decoration: none; color: #333; } a:visited {    color: #333 } a:hover {   color: black }
input {                 -webkit-appearance: none; border-radius: 0; }

.photo {                background-size: cover; background-position: center; background-repeat: no-repeat; background-color: #f5f5f5; 
                        transition: background-size 0.3s ease-in-out }
.hover {                background-size: 100%; }
.hover:hover {          background-size: 110%; }

ul {                    list-style: none; margin: 0.1vw 0 0 0; padding: 0; }
.nav li {                   font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 0.95vw; letter-spacing: -0.01ex; font-weight: normal; font-style: normal; color: black; display: inline-block; position: relative; margin: 0 1.098vw 0 0 }
.sidegrid {             height: auto } .sidegrid .element:nth-child(3n) { margin-right: 0 }
.a_cover {              height: 100%; width: 100%; display: block; position: absolute; top: 0; left: 0 }

.search {               font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 0.95vw; letter-spacing: -0.01ex; font-weight: normal; font-style: normal; color: black; display: inline-block; position: relative; margin: 0.1vw 1.098vw 0 0; 
                        width: 100%; border: none; border-bottom: 1px black solid; padding-bottom: 3px; border-radius: 0 }
.search:focus {             outline: none; outline-style:none; box-shadow:none; border-color:transparent; border-bottom: 1px black solid;  }
#hamburger, nav {       display: none }

.project_title {        font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 0.95vw; letter-spacing: 0; font-weight: normal; font-style: normal;  color: black; text-decoration: none; transition: all 0.1s ease-in-out }
.project_title:visited {color: black }
.project_title:hover {  color: #aaa }
.project_sub {          text-decoration: none; transition: all 0.1s ease-in-out; color: black;  }
.project_sub:visited {  color: black }
.project_sub:hover {    color: #aaa }

nav a {                 color: white; text-decoration: none; transition: all 0.1s ease-in-out }
nav a:visited {         color: white } nav a:hover { color: #aaa }
.nav a {                color: black; text-decoration: none; transition: all 0.1s ease-in-out }
.nav a:visited {        color: black } .nav a:hover { color: #aaa }

.text_big {             font-family: 'StandardSerif', "WTC Our Bodoni", 'Bodoni MT', 'Times New Roman', serif; font-weight: 300; font-size: 2.2vw; line-height: 2.3vw; padding-top: 0; color: black; font-style: italic; height: auto }
.bio {                  font-family: 'StandardSerif', "WTC Our Bodoni", 'Bodoni MT', 'Times New Roman', serif; font-weight: 300; font-size: 1vw; line-height: 1.1vw; color: black; font-style: italic; height: auto; margin-top: 12px; }
.description {          font-family: 'StandardSerif', "WTC Our Bodoni", 'Bodoni MT', 'Times New Roman', serif; font-weight: 300; font-size: 1vw; line-height: 1.1vw; letter-spacing: 0.01ex; font-style: normal }
.tag {                  font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; display: inline-block; color: black; letter-spacing: 0; }
.value {                font-weight: normal; letter-spacing: 0.01ex; font-size: 1vw; line-height: 1.1vw; font-weight: lighter; font-style: normal; color: black; }
.year {                 /*margin-top: 1.7401vw; height: 3.4vw*/ margin-top: 12px; height: 2.1vw }
.designer {             /*margin-top: 1.7401vw; height: 3.4vw*/ margin-top: 12px; height: 2.1vw }

#dida {                 position: fixed; padding: 1.098vw 0 0 2.1961vw; font-size: 0; width: 100vw; height: 100vh; top: 0; overflow-y: auto; overflow-x: hidden;
                        box-sizing: border-box; z-index: 6 }
#dida a {               text-decoration: none; color: #666; } #dida a:visited {    color: #666 } #dida a:hover {   color: black }

.submit {               height: 16px; width: 16px; background-color: transparent; position: absolute; right: 0; border: none; margin: 0;
                        background-image: url('/img/lente-01.svg'); background-size: contain; top: 7px; opacity: 0.2; transition: opacity 0.2s 0s ease-in-out }
.search:focus + .submit { opacity: 1 }

/****/

.tag img					{ opacity: 1.0; transition: ease .15s opacity; -ms-transition: ease .15s opacity; -o-transition: ease .15s opacity; -moz-transition: ease .15s opacity; -webkit-transition: ease .15s opacity; }
.tag img:hover		{ opacity: 0.35 }

/* 8 columns */
@media screen and (min-width: 1300px) and (max-width: 1599px) {

    header {                padding: 1.4279vw 0 0 2.8558vw; height: 6.6962vw; }
    /*hr {                    border-top: 1.317vw black solid }*/

    .logo {                 height: 2vw; margin-top: 0.3vw }
    .description, .value {  font-size: 1.4vw; line-height: 1.6vw }
    .project_title, .tag {  font-size: 1.35vw; line-height: 1.6vw; }

    .search {               font-size: 1.35vw; line-height: 1.6vw }
    .nav li {               font-size: 1.35vw; line-height: 1.6vw }

    .text_big {             font-size: 2.8vw; line-height: 3.3vw; padding-top: 0; margin-top: 0 }
    .bio {                  font-size: 1.4vw; line-height: 1.6vw; margin-top: 12px; }
    .year {                 /*margin-top: 2.634vw; height: 5.4vw*/ height: 2.4vw }
    .designer {             /*margin-top: 2.634vw; height: 2.8vw*/ height: 2.4vw }
    #dida {                 position: fixed; padding: 1.4279vw 0 0 2.8558vw; }

    .submit {               height: 18px; width: 18px; }
}
/* 6 columns */
@media screen and (min-width: 1024px) and (max-width: 1299px) {
    
    header {                padding: 1.7578vw 0 0 3.5156vw; height: 8.7727vw; position: fixed }
    
    .logo {                 height: 31px; margin-top: 2px; margin-left: -5px }
    .project_title {        font-size: 20px; line-height: 23px; }
    
    p {                     font-size: 20px; line-height: 23px }
    /*hr {                    border-top: 1.7537vw black solid }*/
    
    #hamburger {            font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 30px; line-height: 19px; cursor: pointer;
                            top: 1.7578vw; position: absolute; display: block; margin-top: 0; right: 3.5156vw; letter-spacing: -0.1ex; color: #aaa }
    #close {                height: 25px; margin-top: 10px; position: absolute; top: 1.7578vw; right: 0; cursor: pointer }
    nav {                   position: fixed; z-index: 15; width: 100vw; background-color: black; display: block; z-index: 11;
                            padding: 20vh 0 0 3.5156vw; overflow-x: hidden; overflow-y: auto; height: 0; box-sizing: border-box; top: -20vh; display: none }
    .splashmenu li {        font-size: 40px; line-height: 60px; display: block; margin: 0 1.098vw 0 0;
                            font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; letter-spacing: -0.01ex; 
                            font-weight: normal; font-style: normal; color: white; position: relative; }
    nav .logo {             padding-top: 1.7578vw }
    #splashsearch {         font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 40px; -webkit-appearance: none; border-radius: 0;
                            letter-spacing: -0.01ex; font-weight: normal; font-style: normal; color: white; display: inline-block;
                            position: relative; margin: 0.1vw 1.7578vw 0 0; background-color: transparent; line-height: 60px;
                            width: 100%; border: none; border-bottom: 1px white solid; padding: 0 0 6px 0; border-radius: 0 }
    #splashsearch:focus {   outline: none; outline-style:none; box-shadow:none; border-color:transparent; border-bottom: 1px white solid; }
    .nav, .search, .submit {display: none }
    
    .text_big {             font-size: 50px; line-height: 50px; padding-top: 0; margin-top: 0 }
    .bio {                  margin-top: 0; font-size: 20.5px; line-height: 23px }
    .description {          font-size: 20.5px; line-height: 23px }
    .tag {                  font-size: 20px; line-height: 23px }
    .value {                font-size: 20.5px; line-height: 23px }
    .year {                 /*margin-top: 3.5074vw; height: 80px*/ height: 38px }
    .designer {             /*margin-top: 3.5074vw; height: 50px*/ height: 38px }
    #dida {                 position: fixed; padding: 1.7578vw 0 0 3.5156vw;}
}
/* 4 columns */
@media screen and (min-width: 640px) and (max-width: 1023px) {
    
    header {                padding: 1.7578vw 0 0 3.5156vw; height: 8.7727vw; position: fixed }
    
    .logo {                 height: 30px; margin-top: 1px; margin-left: -3px }
    .project_title {        font-size: 25px; line-height: 28px; }
    
    p {                     font-size: 25px; line-height: 28px }
    /*hr {                    border-top: 2.8002vw black solid }*/
    
    #hamburger {            font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 37px; line-height: 19px; cursor: pointer;
                            top: 1.7578vw; position: absolute; display: block; margin-top: 6px; right: 3.5156vw; letter-spacing: -0.1ex; color: #aaa }
    #close {                height: 25px; margin-top: 10px; position: absolute; top: 1.7578vw; right: 0; cursor: pointer }
    nav {                   position: fixed; z-index: 15; width: 100vw; background-color: black; display: block; z-index: 11;
                            padding: 20vh 0 0 3.5156vw; overflow-x: hidden; overflow-y: auto; height: 0; box-sizing: border-box; top: -20vh; display: none }
    .splashmenu li {        font-size: 38px; line-height: 50px; display: block; margin: 0 1.098vw 0 0;
                            font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; letter-spacing: -0.01ex; 
                            font-weight: normal; font-style: normal; color: white; position: relative; }
    nav .logo {             padding-top: 1.7578vw }
    #splashsearch {         font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 38px; -webkit-appearance: none; border-radius: 0;
                            letter-spacing: -0.01ex; font-weight: normal; font-style: normal; color: white; display: inline-block;
                            position: relative; margin: 0.1vw 1.7578vw 0 0; background-color: transparent; line-height: 40px;
                            width: 100%; border: none; border-bottom: 1px white solid; padding: 0 0 6px 0; border-radius: 0 }
    #splashsearch:focus {   outline: none; outline-style:none; box-shadow:none; border-color:transparent; border-bottom: 1px white solid; }
    
    .text_big {             font-size: 36px; line-height: 39.8px; padding-top: 7px }
    .bio {                  margin-top: 0; font-size: 36px; line-height: 39.8px }
    .nav, .search, .submit {display: none }
    .description, .tag {    font-size: 25px; line-height: 28px }
    .value {                font-size: 25.5px; line-height: 28px }
    .year {                 /*margin-top: 5.6004vw; height: 64px*/ height: 37px }
    .designer {             /*margin-top: 5.6004vw; height: 64px*/ height: 37px }
}
/* 2 columns */
@media screen and (max-width: 639px) {
    
    header {                padding: 2.5vw 0 0 5vw; height: 16.6665vw; position: fixed }
    
    .logo {                 height: 25px; margin-top: 12px; }
    
    p {                     font-size: 28px; line-height: 35px }
    /*hr {                    border-top: 3.5416vw black solid }*/
    .project_title {        font-size: 30px; line-height: 35px }
    
    #hamburger {            font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 32px; top: 2vw; cursor: pointer;
                            position: absolute; display: block; margin-top: 7px; right: 5vw; letter-spacing: -0.1ex; color: #aaa }
    #close {                height: 25px; margin-top: 14px; position: absolute; top: 2.5vw; right: 2.5vw; cursor: pointer }
    nav {                   position: fixed; z-index: 15; width: 100vw; background-color: black; display: block; z-index: 11;
                            padding: 20vh 0 0 5vw; overflow-x: hidden; overflow-y: auto; height: 0; box-sizing: border-box; top: -20vh; display: none }
    .splashmenu li {        font-size: 30px; line-height: 50px; display: block; margin: 0 2.5vw 0 0;
                            font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; letter-spacing: -0.01ex; 
                            font-weight: normal; font-style: normal; color: white; position: relative; }
    nav .logo {             padding-top: 2.5vw }
    #splashsearch {         font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 30px; -webkit-appearance: none; border-radius: 0;
                            letter-spacing: -0.01ex; font-weight: normal; font-style: normal; color: white; display: inline-block;
                            position: relative; margin: 0.1vw 1.7578vw 0 0; background-color: transparent; line-height: 50px;
                            width: 100%; border: none; border-bottom: 1px white solid; padding: 0 0 6px 0; border-radius: 0 }
    #splashsearch:focus {   outline: none; outline-style:none; box-shadow:none; border-color:transparent; border-bottom: 1px white solid;  }
    
    .text_big {             font-size: 32px; line-height: 35px; }
    .bio {                  margin-top: 7.0832vw; font-size: 32px; line-height: 35px;  }
    .nav, .search, .submit {display: none }
    .description {          font-size: 32px; line-height: 35px }
    .value {                font-size: 30px; line-height: 35px }
    .year {                 /*margin-top: 7.0832vw; height: 50px*/  height: 30px }
    .designer {             /*margin-top: 7.0832vw; height: 50px*/  height: 30px }
}

/* iphone */
@media only screen and (max-device-width: 480px) and (orientation: portrait),
    only screen and (min-device-width: 560px) and (max-device-width: 1136px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
    header {                padding: 2.5vw 0 0 5vw; height: 16.6665vw; position: fixed }
    
    .logo {                 height: 13px; margin-top: 6px; }
    
    p {                     font-size: 14px; line-height: 18px }
    hr {                    border-top: 4px black solid }
    .project_title {        font-size: 15px; line-height: 18px }
    
    #hamburger {            font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 17px; top: 2.5vw; cursor: pointer;
                            position: absolute; display: block; margin-top: 4px; right: 5vw; letter-spacing: -0.1ex; color: #aaa }
    #close {                height: 13px; margin-top: 7px; position: absolute; top: 2.5vw; right: 2.5vw; cursor: pointer }
    nav {                   position: fixed; z-index: 15; width: 100vw; background-color: black; display: block; z-index: 11;
                            padding: 20vh 0 0 5vw; overflow-x: hidden; overflow-y: auto; height: 0; box-sizing: border-box; top: -20vh; display: none }
    .splashmenu li {        font-size: 15px; line-height: 25px; display: block; margin: 0 2.5vw 0 0;
                            font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; letter-spacing: -0.01ex; 
                            font-weight: normal; font-style: normal; color: white; position: relative; }
    nav .logo {             padding-top: 2.5vw }
    #splashsearch {         font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 15px; -webkit-appearance: none; border-radius: 0;
                            letter-spacing: -0.01ex; font-weight: normal; font-style: normal; color: white; display: inline-block;
                            position: relative; margin: 0.1vw 2.5vw 0 0; background-color: transparent; line-height: 25px;
                            width: 100%; border: none; border-bottom: 1px white solid; padding: 0 0 6px 0; border-radius: 0 }
    #splashsearch:focus {   outline: none; outline-style:none; box-shadow:none; border-color:transparent; border-bottom: 1px white solid;  }
    
    .text_big {             font-size: 16px; line-height: 18px; }
    .bio {                  margin-top: 7.0832vw; font-size: 16px; line-height: 18px;  }
    .nav, .search, .submit {display: none }
    .description {          font-size: 16px; line-height: 18px }
    .value {                font-size: 15px; line-height: 18px }
    .year {                 /*margin-top: 7.0832vw; height: 25px*/ height: 18px }
    .designer {             /*margin-top: 7.0832vw; height: 25px*/ height: 18px }
}

@media only screen and (max-device-width: 480px) and (orientation: landscape), 
    only screen and (min-device-width: 560px) and (max-device-width: 1136px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
    header {                padding: 1.4844vw 0 0 2.9688vw; height: 8.7727vw; position: fixed }
    
    .logo {                 height: 13px; margin-top: 6px; }
    
    p {                     font-size: 14px; line-height: 18px }
    hr {                    border-top: 4px black solid }
    .project_title {        font-size: 15px; line-height: 18px }
    
    #hamburger {            font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 15px; top: 2.5vw; cursor: pointer;
                            position: absolute; display: block; margin-top: 4px; right: 5vw; letter-spacing: -0.1ex; color: #aaa }
    #close {                height: 13px; margin-top: 7px; position: absolute; top: 2.5vw; right: 2.5vw; cursor: pointer }
    nav {                   position: fixed; z-index: 15; width: 100vw; background-color: black; display: block; z-index: 11;
                            padding: 20vh 0 0 5vw; overflow-x: hidden; overflow-y: auto; height: 0; box-sizing: border-box; top: -20vh; display: none }
    .splashmenu li {        font-size: 15px; line-height: 25px; display: block; margin: 0 2.5vw 0 0;
                            font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; letter-spacing: -0.01ex; 
                            font-weight: normal; font-style: normal; color: white; position: relative; }
    nav .logo {             padding-top: 2.5vw }
    #splashsearch {         font-family: "StandardGrotesk-Regular", "NHaasGroteskTXPro-65Md", Helvetica, Arial, sans-serif; font-size: 15px; -webkit-appearance: none; border-radius: 0;
                            letter-spacing: -0.01ex; font-weight: normal; font-style: normal; color: white; display: inline-block;
                            position: relative; margin: 0.1vw 2.5vw 0 0; background-color: transparent; line-height: 25px;
                            width: 100%; border: none; border-bottom: 1px white solid; padding: 0 0 6px 0; border-radius: 0 }
    #splashsearch:focus {   outline: none; outline-style:none; box-shadow:none; border-color:transparent; border-bottom: 1px white solid;  }
    
    .text_big {             font-size: 16px; line-height: 18px; }
    .bio {                  margin-top: 7.0832vw; font-size: 16px; line-height: 18px;  }
    .nav, .search, .submit {display: none }
    .description {          font-size: 16px; line-height: 18px }
    .value {                font-size: 15px; line-height: 18px }
    .year {                 /*margin-top: 5.6004vw; height: 25px*/ height: 18px }
    .designer {             /*margin-top: 5.6004vw; height: 25px*/ height: 18px }
}