*, *::before, *::after {
  box-sizing:border-box;
}

html, body {
  width:100%;
  max-width:100%;
  margin:0;
  overflow-x:hidden;
}

body {
  font-family:"futura-pt-condensed", sans-serif;
  color:#000;
  background:#fff;
}

body.print-page main {
  width:100%;
  max-width:none;
}

.print-opening {
  width:100%;
  max-width:1680px;
  aspect-ratio:1680 / 880;
  height:auto;
  margin:0 auto;
  position:relative;
  overflow:hidden;
}

.print-statement {
  margin:0;
  font-size:31px;
  font-weight:400;
  line-height:1.18;
  left:calc(220.5235 / 1680 * 100%);
  top:calc(110.2 / 880 * 100%);
  width:calc(559.3975 / 1680 * 100%);
  position: absolute;
}

.print-statement p {
  margin:0 0 clamp(0px, calc(35 / 1680 * 100vw), 35px);
}

.print-statement span {
  display:block;
}

.print-opening-01 {
  position:absolute;
  display:block;
  max-width:none;
  left:calc(856.6734 / 1680 * 100%);
  top:calc(110.2 / 880 * 100%);
  width:calc(502.7102 / 1680 * 100%);
  height:auto;
  object-fit:contain;
}


/* 
=========================================================
RELIEF
Artboard: 1680 x 960
========================================================= 
*/


.relief-etching {
  width:1680px;
  height:960px;
  margin:0 auto;
  padding:0px;
  position:relative;
  overflow:hidden;
}

.relief-etching h2 {
  font-family:"futura-pt-condensed", sans-serif;
  font-style:italic;
  position:absolute;
  left: calc(24 / 1680 * 100%);
  top: calc(13 / 960 * 100%);
  z-index:20;
  margin:0;
  font-size:44px;
  font-weight:300;
  letter-spacing:0;
  line-height:1;
}

.etching-layout {
  position:absolute;
  left:0;
  top:0px;
  width:100%;
  height:960px;
}

.etching-layout img{
  position: absolute;
  height: auto;
  margin: 0;
}

.relief-etching p{
  position: absolute;
  height: auto;
  margin: 0;
  font-weight:400;
}

.etching-01 {
  left:calc(823.2351 / 1680 * 100%);
  top:calc(518.265 / 960 * 100%);
  width:calc(363.8443 / 1680 * 100%);
}
.relief-01 {
  left:calc(286.3044 / 1680 * 100%);
  top:calc(250.5047 / 960 * 100%);
  width:calc(302.9998 / 1680 * 100%);
}
.relief-02 {
  left:calc(120.1042 / 1680 * 100%);
  top:calc(518.2653 / 960 * 100%);
  width:calc(307.2156 / 1680 * 100%);
}
.relief-03 {
  left:calc(457.3198 / 1680 * 100%);
  top:calc(518.2653 / 960 * 100%);
  width:calc(298.1846 / 1680 * 100%);
}
.relief-04 {
  left:calc(687.0267 / 1680 * 100%);
  top:calc(223.1971 / 960 * 100%);
  width:calc(262.5721 / 1680 * 100%);
}
.relief-05 {
  left:calc(979.5988 / 1680 * 100%);
  top:calc(223.1971 / 960 * 100%);
  width:calc(298.5432 / 1680 * 100%);
}
.relief-06 {
  left:calc(1308.142 / 1680 * 100%);
  top:calc(223.1971 / 960 * 100%);
  width:calc(251.7538 / 1680 * 100%);
}
.caption-relief {
  left:calc(284.1284 / 1680 * 100%);
  top:calc(774.0479 / 960 * 100%);
}
.caption-study {
  left:calc(1071.2783 / 1680 * 100%);
  top:calc(478.9795 / 960 * 100%);
}
.caption-etching {
  left:calc(930.2344 / 1680 * 100%);
  top:calc(774.0469 / 960 * 100%);
}

/* 
=========================================================
SCREEN-PRINTING
Artboard: 1680 x 960
========================================================= 
*/


.general-print {
  width:1680px;
  height:960px;
  margin:0 auto;
  padding:0px;
  position:relative;
  overflow:hidden;
}

.general-print h2 {
  font-family:"futura-pt-condensed", sans-serif;
  font-style:italic;
  position:absolute;
  left: calc(24 / 1680 * 100%);
  top: calc(13 / 960 * 100%);
  z-index:20;
  margin:0;
  font-size:44px;
  font-weight:300;
  letter-spacing:0;
  line-height:1;
}

.general-layout {
  position:absolute;
  left:0;
  top:0px;
  width:100%;
  height:960px;
}

.general-layout img{
  position: absolute;
  height: auto;
  margin: 0;
}

.general-print p{
  position: absolute;
  height: auto;
  margin: 0;
  font-weight:400;
}

.general-01 {
  left:calc(146.884 / 1680 * 100%);
  top:calc(132.0304 / 960 * 100%);
  width:calc(496.0245 / 1680 * 100%);
}
.general-02 {
  left:calc(672.9085 / 1680 * 100%);
  top:calc(131.1668 / 960 * 100%);
  width:calc(191.7011 / 1680 * 100%);
}
.general-03 {
  left:calc(939.6096 / 1680 * 100%);
  top:calc(131.1668 / 960 * 100%);
  width:calc(255.6015 / 1680 * 100%);
}
.general-04 {
  left:calc(1270.2111 / 1680 * 100%);
  top:calc(131.1668 / 960 * 100%);
  width:calc(116.8457 / 1680 * 100%);
}
.general-05 {
  left:calc(1416.2704 / 1680 * 100%);
  top:calc(131.1668 / 960 * 100%);
  width:calc(116.8457 / 1680 * 100%);
}
.general-06 {
  left:calc(1270.2111 / 1680 * 100%);
  top:calc(316.1746 / 960 * 100%);
  width:calc(116.8457 / 1680 * 100%);
}
.general-07 {
  left:calc(1416.2704 / 1680 * 100%);
  top:calc(316.1746 / 960 * 100%);
  width:calc(116.8457 / 1680 * 100%);
}
.general-08 {
  left:calc(189.7234 / 1680 * 100%);
  top:calc(552.042 / 960 * 100%);
  width:calc(255.6015 / 1680 * 100%);
}
.general-09 {
  left:calc(515.325 / 1680 * 100%);
  top:calc(552.0419 / 960 * 100%);
  width:calc(263.3471 / 1680 * 100%);
}
.general-10 {
  left:calc(848.672 / 1680 * 100%);
  top:calc(552.042 / 960 * 100%);
  width:calc(454.4027 / 1680 * 100%);
}
.general-11 {
  left:calc(1333.8149 / 1680 * 100%);
  top:calc(552.0229 / 960 * 100%);
  width:calc(155.7215 / 1680 * 100%);
}
.general-12 {
  left:calc(1333.0747 / 1680 * 100%);
  top:calc(737.7444 / 960 * 100%);
  width:calc(157.2018 / 1680 * 100%);
}
.caption-optical {
  left:calc(366.6406 / 1680 * 100%);
  top:calc(484.2383 / 960 * 100%);
}
.caption-repeat {
  left:calc(1019.4258 / 1680 * 100%);
  top:calc(484.2383 / 960 * 100%);
}
.caption-cmyk {
  left:calc(1313.4287 / 1680 * 100%);
  top:calc(484.2383 / 960 * 100%);
}
.caption-shirt {
  left:calc(243.3271 / 1680 * 100%);
  top:calc(922.3135 / 960 * 100%);
}
.caption-zine {
  left:calc(633.5083 / 1680 * 100%);
  top:calc(922.3135 / 960 * 100%);
}
.caption-virgil {
  left:calc(1024.9746 / 1680 * 100%);
  top:calc(922.3135 / 960 * 100%);
}

/* 
=========================================================
BRANDING
Artboard: 1680 x 960
========================================================= 
*/

.brand-printing {
  width:1680px;
  height:960px;
  margin:0 auto;
  padding:0px;
  position:relative;
  overflow:hidden;
}

.brand-printing h2 {
  font-family:"futura-pt-condensed", sans-serif;
  font-style:italic;
  position:absolute;
  left: calc(24 / 1680 * 100%);
  top: calc(13 / 960 * 100%);
  z-index:20;
  margin:0;
  font-size:44px;
  font-weight:300;
  letter-spacing:0;
  line-height:1;
}

.brand-layout {
  position:absolute;
  left:0;
  top:0px;
  width:100%;
  height:960px;
}

.brand-layout img {
  position: absolute;
  height: auto;
  margin: 0;
}

.brand-printing p{
  position: absolute;
  height: auto;
  margin: 0;
  font-weight:400;
}

.branding-01 {
  left:calc(264.5883 / 1680 * 100%);
  top:calc(124.669 / 960 * 100%);
  width:calc(453.4465 / 1680 * 100%);
}

.branding-02 {
  left:calc(754.6329 / 1680 * 100%);
  top:calc(124.669 / 960 * 100%);
  width:calc(176.7454 / 1680 * 100%);
}

.branding-03 {
  left:calc(967.9764 / 1680 * 100%);
  top:calc(124.669 / 960 * 100%);
  width:calc(176.7454 / 1680 * 100%);
}

.branding-04 {
  left:calc(1181.3199 / 1680 * 100%);
  top:calc(124.669 / 960 * 100%);
  width:calc(234.0918 / 1680 * 100%);
}

.branding-05 {
  left:calc(317.7436 / 1680 * 100%);
  top:calc(497.2294 / 960 * 100%);
  width:calc(503.9574 / 1680 * 100%);
}

.branding-06 {
  left:calc(858.299 / 1680 * 100%);
  top:calc(497.2294 / 960 * 100%);
  width:calc(503.9574 / 1680 * 100%);
}

.caption-branding {
  left:calc(695.71 / 1680 * 100%);
  top:calc(912.1602 / 960 * 100%);
}

/* 
=========================================================
PERSONAL
Artboard: 1680 x 960
========================================================= 
*/

.personal {
  width:1680px;
  height:960px;
  margin:0 auto;
  padding:0px;
  position:relative;
  overflow:hidden;
}

.personal h2 {
  font-family:"futura-pt-condensed", sans-serif;
  font-style:italic;
  position:absolute;
  left: calc(24 / 1680 * 100%);
  top: calc(13 / 960 * 100%);
  z-index:20;
  margin:0;
  font-size:44px;
  font-weight:300;
  letter-spacing:0;
  line-height:1;
}

.personal-layout {
  position:absolute;
  left:0;
  top:0px;
  width:100%;
  height:960px;
}

.personal-layout img{
  position: absolute;
  height: auto;
  margin: 0;
}

.personal p{
  position: absolute;
  height: auto;
  margin: 0;
  font-weight:400;
}

.personal-01 {
  left:calc(216.176 / 1680 * 100%);
  top:calc(115.0669 / 960 * 100%);
  width:calc(249.73 / 1680 * 100%);
}

.personal-02 {
  left:calc(495.9058 / 1680 * 100%);
  top:calc(115.0669 / 960 * 100%);
  width:calc(244.825 / 1680 * 100%);
}

.personal-03 {
  left:calc(770.7308 / 1680 * 100%);
  top:calc(115.0669 / 960 * 100%);
  width:calc(253.7408 / 1680 * 100%);
}

.personal-04 {
  left:calc(1054.4716 / 1680 * 100%);
  top:calc(115.0669 / 960 * 100%);
  width:calc(409.3526 / 1680 * 100%);
}

.personal-05 {
  left:calc(281.1054 / 1680 * 100%);
  top:calc(536.9528 / 960 * 100%);
  width:calc(229.6919 / 1680 * 100%);
}

.personal-06 {
  left:calc(540.7973 / 1680 * 100%);
  top:calc(536.9528 / 960 * 100%);
  width:calc(299.2027 / 1680 * 100%);
}

.personal-07 {
  left:calc(870 / 1680 * 100%);
  top:calc(536.9528 / 960 * 100%);
  width:calc(268.8777 / 1680 * 100%);
}

.personal-08 {
  left:calc(1168.8777 / 1680 * 100%);
  top:calc(594.1088 / 960 * 100%);
  width:calc(244.1435 / 1680 * 100%);
}

.caption-indigo {
  left:calc(414 / 1680 * 100%);
  top:calc(486 / 960 * 100%);
}

.caption-top-influence {
  left:calc(801 / 1680 * 100%);
  top:calc(486 / 960 * 100%);
}

.caption-yardage {
  left:calc(1161 / 1680 * 100%);
  top:calc(486 / 960 * 100%);
}

.caption-technicians {
  left:calc(454 / 1680 * 100%);
  top:calc(905 / 960 * 100%);
}

.caption-valentine {
  left:calc(1075 / 1680 * 100%);
  top:calc(905 / 960 * 100%);
}

/* 
=========================================================
PRODUCTION
Artboard: 1680 x 960
========================================================= 
*/

.production {
  width:1680px;
  height:960px;
  margin:0 auto;
  padding:0px;
  position:relative;
  overflow:hidden;
}

.production h2 {
  font-family:"futura-pt-condensed", sans-serif;
  font-style:italic;
  position:absolute;
  left: calc(24 / 1680 * 100%);
  top: calc(13 / 960 * 100%);
  z-index:20;
  margin:0;
  font-size:44px;
  font-weight:300;
  letter-spacing:0;
  line-height:1;
}

.production-layout {
  position:absolute;
  left:0;
  top:0px;
  width:100%;
  height:960px;
}

.production-layout img{
  position: absolute;
  height: auto;
  margin: 0;
}

.production p{
  position: absolute;
  height: auto;
  margin: 0;
  font-weight:400;
}

.production-01 {
  left:calc(1174.1054 / 1680 * 100%);
  top:calc(464.6976 / 960 * 100%);
  width:calc(309.6093 / 1680 * 100%);
}
.production-02 {
  left:calc(1055.745 / 1680 * 100%);
  top:calc(135.5684 / 960 * 100%);
  width:calc(427.9697 / 1680 * 100%);
}
.production-03 {
  left:calc(882.3762 / 1680 * 100%);
  top:calc(464.6976 / 960 * 100%);
  width:calc(261.7292 / 1680 * 100%);
}
.production-04 {
  left:calc(622.1266 / 1680 * 100%);
  top:calc(135.5684 / 960 * 100%);
  width:calc(206.9356 / 1680 * 100%);
}
.production-05 {
  left:calc(622.1266 / 1680 * 100%);
  top:calc(464.6976 / 960 * 100%);
  width:calc(230.2496 / 1680 * 100%);
}
.production-06 {
  left:calc(859.0621 / 1680 * 100%);
  top:calc(135.5684 / 960 * 100%);
  width:calc(166.6829 / 1680 * 100%);
}
.production-colorway {
  left:calc(196.2853  / 1680 * 100%);
  top:calc(135.5684 / 960 * 100%);
  width:calc(395.8413 / 1680 * 100%);
}
.caption-production {
  left:calc(762 / 1680 * 100%);
  top:calc(905 / 960 * 100%);
}

.next-project {
  width:100%;
  max-width:1680px;
  min-height:475px;
  margin:0 auto;
  padding:80px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-end;
}

.next-project p {
  margin:0 0 15px;
  font-size:22px;
  opacity:.5;
}
.next-project a {
  color:#000;
  font-size:clamp(42px, 4.2vw, 70px);
  line-height:1;
  text-decoration:none;
}

@media screen and (max-width:767px), screen and (orientation:portrait), screen and (orientation:landscape) and (max-height:500px) {
  .print-statement {
    font-size:calc(23 / 1680 * 100vw);
  }
  .relief-etching h2,
  .general-print h2,
  .brand-printing h2,
  .personal h2,
  .production h2 {
    font-size:calc(54 / 1680 * 100vw);
  }
  .relief-etching p,
  .general-print p,
  .brand-printing p,
  .personal p,
  .production p {
    font-size:calc(17 / 1680 * 100vw);
  }
  .next-project {
    min-height:240px;
    padding:20px;
  }
  .next-project p {
    font-size:16px;
  }
  .next-project a {
    font-size:42px;
  }
}