html {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  font-weight: 400;
}

body::-webkit-scrollbar, *::-webkit-scrollbar {background:#1d1e22;}
body::-webkit-scrollbar-thumb, *::-webkit-scrollbar-thumb {background:#717E86;}

/**
 * Firefox specific rule
 */

@-moz-document url-prefix() {
  body {
    font-weight: lighter !important;
  }
}

/*FONT */
@font-face {
  font-family: 'Synonym-Light';
  src: url('Synonym-Light.woff2') format('woff2'),
       url('Synonym-Light.woff') format('woff'),
       url('Synonym-Light.ttf') format('truetype');
       font-weight: 300;
       font-display: swap;
       font-style: normal;
}


@font-face {
  font-family: 'Synonym-Semibold';
  src: url('Synonym-Semibold.woff2') format('woff2'),
       url('Synonym-Semibold.woff') format('woff'),
       url('Synonym-Semibold.ttf') format('truetype');
       font-weight: 400;
       font-display: swap;
       font-style: normal;
}

@font-face {
    font-family: 'coveslight';
    src: url('coves_light-webfont.woff2') format('woff2'),
         url('coves_light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
 font-family: 'glyphalt65bold';
 src: url('glyphalt65bold.eot');
 src: url('glyphalt65bold.eot?#iefix') format('embedded-opentype'), url('glyphalt65bold.woff') format('woff'), url('glyphalt65bold.ttf') format('truetype'), url('museo_slab_500-webfont.svg#glyphalt65bold') format('svg');
 font-weight: normal;
 font-style: normal;
}
 
/* COMMON */
* { -webkit-appearance: none; padding:0; margin:0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; list-style-type:none; color:#1d1e22; font-family:'Synonym-Light', Helvetica, Arial, sans-serif; outline:none; border:none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-tap-highlight-color: transparent; font-weight: normal;}
body {background:#f2f2f2;}
p {  letter-spacing: 2px;  line-height: 23px;  font-size: 14px; text-shadow: 0.2px 0.2px 0.5px #1d1e22;}
@-moz-document url-prefix() {
	p {  text-shadow: 0 0 0 #1d1e22;}
}

strong { font-weight: bold;}
q {font-style:italic;}
img {image-rendering: -webkit-optimize-contrast;}
.d-none {display: none!important;}
@supports (-webkit-touch-callout: none) {
    img {
        image-rendering: auto;
    }
}
#bodyInner.straightIn {padding:155px 0 0 0;}
 input::-moz-focus-inner {border: 0;}
 #wrapper {display:flex;  gap:85px;}
 .hidden {display:none!important;}
 .flight {position:relative; }
article { width: calc(100vw - 282px);}
 article#portfolio {width: calc(100vw - 179px);}
 .heading { padding: 0 0 0 45px; position: relative;}
 .heading h1, .heading h2 { letter-spacing: 7px; font-size: 16px; /* font-weight:bold; */ width:100%; font-family: 'coveslight'; text-transform:uppercase;  margin: 0 0 35px 0; line-height: 25px;}
 .heading h1:before, .heading h2:before{ background-color: #1d1e22;  position: absolute;   content: "";  width: 3px;  height: 32px;   left: 0px;   top: -6px;   display: block;}
 .heading p {  max-width: 400px; }
.heading span {cursor:pointer; border-bottom: 1px solid #000;}
.heading i {font-size:12px;}
::selection {  background: #5eb4ef; color:#ffffff; }
::-moz-selection {  background: #5eb4ef; color:#ffffff;}
.ios a, .ios { text-decoration:none; color:#000000;}
.scrollrestrict {overflow-y: hidden;}
.newsletter.subSplash.scrollrestrict article #splash {  opacity: 0;}
ul.genuine {padding:25px 0 0 0;}
ul.genuine li {list-style-type: circle; list-style-position: outside;  margin: 0 0 0 16px; letter-spacing: 2px;    line-height: 23px; color:#1d1e22;  font-size: 14px;  text-shadow: 0.2px 0.2px 0.5px #1d1e22;}
 input, textarea, select { border-radius:0!important }
form .button {margin:-13px  0 0 0;}
form input#submit {  background: transparent;  position: relative;  display: block;  width: 100%;  height: 100%;  letter-spacing: 2px; text-transform: uppercase;  text-decoration: none;  color:#1d1e22;   font-size: 14px; cursor: pointer;}
form > span {line-height: 33px; position:relative;  letter-spacing: 7px; text-transform: uppercase; font-size: 12px; width: 100%;  display: block;}
form > span small {  text-transform: none;  font-size: 13px;  letter-spacing: 1px;  line-height: 19px;   display: flex;  color: #1d1e22;}

#feedBackForm  .radioGroup span { display: flex!important; flex-wrap:wrap;}
#feedBackForm  .radioGroup span div {margin:30px 30px 7px 0;  background: #f2f2f2;   padding: 9px 15px;}
#feedBackForm  .radioGroup span div.active, #feedBackForm  .radioGroup span div.active label {background:#000; color:#ffffff;}
#feedBackForm  .radioGroup label {cursor:pointer; padding:10px 30px 7px 0;} 
#feedBackForm  .radioGroup p {width:100%; display:block; font-size: 12px;}


.inputText {position: absolute; background: transparent; border-bottom: 1px solid #cecece;  color: #000000; font-size: 17px; height: 35px; margin: 6px 0 10px; padding: 9px 7px 11px 157px; width: 100%; letter-spacing: 1px; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; left: 0; top: -8px; }
.inputTextSingle { text-align:center; background: none repeat scroll 0 0 #959b9e; border: 0 none; color: #000000; font-size: 13px; height: 35px; padding: 9px 7px; width: 40px; float:left; margin:7px 5px 3px 13px; letter-spacing:1px; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; }
.inputTextArea { letter-spacing:1px; border: 0 none; color: #000000;  border-bottom: 1px solid #cecece;font-size: 17px; margin: 6px 0 10px; padding: 9px 7px; width: 100%; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; }
.sendbutton, #error { clear: both; padding:18px 0 0 0;}
.sendbutton.fetching .button {display:none;}
.errorclue { border-bottom: 1px solid #FF0066!important;}
.theError { color:#FF0066; }
.loading { -webkit-appearance: none; display:inline-block; padding:12px 12px;  letter-spacing: 2px; text-transform: uppercase;  text-decoration: none;  color: #eaebec;  font-size: 14px; border:0; cursor:pointer; }
.returnsuccess { background:#00ffa8; padding:15px; color: #1d1e22; max-width: 345px; margin: 0; letter-spacing: 2px;}
.targetbutton {background:#eaebec; width: 50px;  height: 50px;  border-radius: 100%; cursor:pointer; text-align:center;}
.targetbutton span {background:#eaebec; border-radius: 100%; cursor:pointer; width: 44px;  height: 44px; margin:3px;  font-size: 22px; line-height: 45px;  display: inline-block;  -webkit-touch-callout: none;  -webkit-user-select: none;  -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.targetbutton:hover span {background:#d3d7d8;}
.formButtons{ display: flex; align-items: center;}
.formButtons form .button { margin: -17px 0 0 0;}
.recaptcha { display: flex;  padding: 2% 0;  margin: 0 2% 0 0;}
.recaptcha small:before { content: '\25C1';  position: absolute;  left: -23px;  top: 8px;}
.recaptcha small {  max-width: 200px;  margin: 8px 11px 8px 35px;  font-size: 15px;  position: relative;}
.targetbutton span:active {box-shadow: 1px 1px 12px 0px rgba(94, 180, 239, 0.75); color:#5eb4ef;}
.targetbutton:hover {box-shadow: 2px 2px 14px 0px rgba(78, 78, 78, 0.2);}

 /* HEADER */
#wrapper > header section { text-align: center; padding: 100px 0 0 0px; width:180px; z-index:80;}
header section .device1 {opacity:0; animation: device1 1.5s ease; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; transform-box: fill-box; position:relative;}
header section .device2 {opacity:0; animation: device2 1.5s ease; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; transform-box: fill-box;  position:relative;}
header section .device3 {opacity:0; animation: device3 1.5s ease; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; transform-box: fill-box;  position:relative;}
header section .device4 {opacity:0; animation: device4 1.5s ease; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; transform-box: fill-box;  position:relative;}
header section.mobile {display:none;}
header section.usual #logo {transform: translateX(-50px); margin: 0 0 0 -8px; position:fixed;     z-index: 600;}
header section.usual #logo svg{ width: 100%;  max-width: 128px;}

/* NAVIGATION */
.noSplash  header nav > span {flex: 1; /*border-bottom: 1px solid #737373;*/}
.noSplash header nav ul li a { /* font-weight:bold; */padding: 10px 0; position:relative; letter-spacing: 7px; text-decoration:none; letter-spacing: 3px;  text-transform: uppercase;  font-size: 12px;   color: #1d1e22; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; display:inline-block;}
.noSplash  header nav ul li a:hover{color: #858382;}
.noSplash  header nav ul li a:focus:after, header nav ul li a:hover:after { width: 100%;   height: 2px; outline: 0;  background-color: #737373;  -webkit-transition: all 0.2s ease 0s;  -moz-transition: all 0.2s ease 0s;  -ms-transition: all 0.2s ease 0s;  -o-transition: all 0.2s ease 0s;  transition: all 0.2s ease 0s;}

header nav {display:flex; z-index:400;  width: 100%;  position: absolute;  padding: 35px 0 0 0;}
header nav > span {flex: 1; border-bottom: 1px solid #737373;}
header nav ul { display: flex; flex-direction: row;  width: 650px;   gap: 55px;   margin-left: auto;   padding: 0 55px;   margin-bottom: -16px;}
header nav ul li {flex: 1 1 auto;}
header nav ul li a {padding: 10px 0; position:relative; letter-spacing: 7px; text-decoration:none; letter-spacing: 3px;  text-transform: uppercase;  font-size: 12px;   color: #ffffff; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; display:inline-block;}
header nav ul li a:hover{color: #858382;}
header nav ul li a:after { position: absolute; content: "";  width: 2px;  height: 2px;   left: 0;  bottom: -4px;}
header nav ul li a:focus:after, header nav ul li a:hover:after { width: 100%;   height: 2px; outline: 0;  background-color: #737373;  -webkit-transition: all 0.2s ease 0s;  -moz-transition: all 0.2s ease 0s;  -ms-transition: all 0.2s ease 0s;  -o-transition: all 0.2s ease 0s;  transition: all 0.2s ease 0s;}
header nav.active {  z-index: 999;  position: fixed;}
 
 /* BUTTON */
 .button {cursor:pointer; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; text-transform:uppercase; text-decoration: none; color:#eaebec; font-size:14px; background:#f2f2f2; text-align:center; line-height: 48px; letter-spacing: 2px; display:inline-block; margin:75px 0 0 0; position:relative; height: 50px; line-height: 53px;  border: none; text-align:left; }
.button span {cursor:pointer; position: relative;display: block;width: 100%;  height: 100%; letter-spacing:2px;  padding: 0 25px;}
.button:before,.button:after { position: absolute; content: ""; right: 0; top: 0;  background:#1d1e22; transition: all 0.1s ease;}
.button:before {  height: 0%; width: 2px;}
.button:after {  width: 0%;  height: 2px;}
.button:hover{ background:#ffffff;box-shadow: 2px 3px 14px 0px rgba(78, 78, 78, 0.2);}
.button:hover:before { height: 100%;}
.button:hover:after {  width: 100%;}
.button span:before, .button span:after { position: absolute; content: ""; left: 0; bottom: 0;  background:#1d1e22; transition: all 0.1s ease;}
.button span:before { width: 2px; height: 0%;}
.button span:after { width: 0%;height: 2px;}
.button span:hover:before { height: 100%;}
.button span:hover:after { width: 100%;}
.button span{border-bottom:0;}

.button.altbutton{background:#30343B;border-bottom:0;}
.button.altbutton span {cursor:pointer; position: relative;display: block;width: 100%; color:#cecece;  height: 100%; letter-spacing:2px;  padding: 0 25px;}
.button.altbutton:before,.button.altbutton:after { position: absolute; content: ""; right: 0; top: 0;  background:#1d1e22; transition: all 0.1s ease;}
.button.altbutton:before {  height: 0%; width: 2px;}
.button.altbutton:after {  width: 0%;  height: 2px;}
.button.altbutton:hover{ background:#ffffff;box-shadow: 2px 3px 14px 0px rgba(78, 78, 78, 0.2);}
.button.altbutton:hover:before { height: 100%;}
.button.altbutton:hover:after {  width: 100%;}
.button.altbutton:hover span{color:#1d1e22;}
.button.altbutton span:before, .button.altbutton span:after { position: absolute; content: ""; left: 0; bottom: 0;  background:#1d1e22; transition: all 0.1s ease;}
.button.altbutton span:before { width: 2px; height: 0%;}
.button.altbutton span:after { width: 0%;height: 2px;}
.button.altbutton span:hover:before { height: 100%;}
.button.altbutton span:hover:after { width: 100%;}
.button.altbutton span{border-bottom:0;}

.button.disabled {opacity:0.3; pointer-events:none;}

 
 /* SLIDERS */
.slider {width: 100%; margin: 0px auto; cursor: grab; cursor: -moz-grab; cursor: -webkit-grab; padding: 0 0 200px 80px; overflow:hidden;}
.slider.null {cursor:default;}
span.advance{padding-right: 22px; text-align: right;  width: 100%;   display: inline-block; z-index: 400; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out;   -o-transition: all 0.2s ease-in-out;   transition: all 0.2s ease-in-out;  cursor: pointer;  font-size: 24px;  position: relative;   left: 82px;  top: -16px;   transform: translateX(-100%);}
span.advance:hover {padding-right:12;}
.slider .slick-slide { margin: 0px 20px;}
.slider .slideContent {height:80vh; justify-content: flex-start; width: 70.5vw !important; display: flex!Important; align-items: center;}
.slider .slick-slide {  transition: all ease-in-out .3s;   opacity: .2; }
.slider .slick-slide:hover {opacity:.3;}
.slider .slick-active {  opacity: .7; }
.slider .slick-current, .slider .slick-current:hover {  opacity: 1; }
.slider .slick-list {margin: 0 0 0 -32px!important;}
.slider .slideCaption {padding: 55px;  opacity: 1;  transform: translateY(0px); display: flex;  flex-wrap: wrap; align-content: center; margin-top: -90px;}
.slider .slideCaption h3 { margin: 0 0 40px 0;font-family:'glyphalt65bold'; color:#1d1e22; font-size:37px;}
.slider .slideContent.finalSlide .slideCaption {max-width: 345px; max-width: 345px;  margin: 50px 5% 0px;   padding: 0 2%;}
.slider .slideContent.finalSlide img {  max-width:33%;  margin-bottom: auto;  margin-top: 12%;}
.slider .slideContent.finalSlide .links {padding: 0 2%; max-width:33%;}
.slider .slideContent.finalSlide .subNav ul {   margin: 25px 0 0 0;}
.slider .slideContent.finalSlide .slideCaption > span {  color: #858382;  letter-spacing: 7px;   text-transform: uppercase; font-size: 16px;  margin: 0 auto 25px;  display: inline-block;}
.slider .slideCaption > span { letter-spacing: 5px;  text-transform: uppercase;  font-size: 12px; font-family: 'coveslight'; writing-mode: vertical-rl;  /*  font-weight: bold; */   position: absolute;   left: -496px;  bottom: 0;}
.slider .slideCaption > span em {margin: 0 1em;   font-style: normal;   font-size: 17px;   position: relative;  left: 3px;}
.slider .slideCaption img {max-width:100px;  position: absolute; margin: 45px;  bottom: 0; right: 0;}
.slider .slick-active .slideImages img {transform: scale(1); margin:0; -webkit-transition: transform 0.1s ease-in-out 0s; -moz-transition: transform 0.1s ease-in-out 0s; -o-transition: transform 0.1s ease-in-out 0s; transition: transform 0.1s ease-in-out 0s;}
.slider .slideImages img.portrait {max-height:610px; -webkit-transition: left 0.2s ease-in-out; left:0;}
.slider .slick-initialized .slick-slide { display: flex;}
.slider .slick-active .slideImages:hover img { }
.slider .slideContentInner { max-width: 920px; display: flex; background: #ffffff;}
.slider .slideImages img {position: relative; top:0; left:0;clip-path: polygon(0% 0%,0% 0%,100% 0%,100% 100%,100% 100%,0% 100%);  -webkit-transition: transform 0.2s ease-in-out, margin 0.2s ease-in-out, clip-path 0.2s ease-in-out 0s; -moz-transition: transform 0.2s ease-in-out, margin 0.2s ease-in-out, clip-path 0.2s ease-in-out 0s; -o-transition: transform 0.2s ease-in-out, margin 0.2s ease-in-out, clip-path 0.2s ease-in-out 0s; transition: transform 0.2s ease-in-out, margin 0.2s ease-in-out, clip-path 0.2s ease-in-out 0s;  -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s;}
.slider .slick-list {overflow:visible;}


.slideContent.finalSlide  > div{ background-image: linear-gradient(90deg, #dedede 11.11%, #f2f2f2 11.11%, #f2f2f2 50%, #dedede 50%, #dedede 61.11%, #f2f2f2 61.11%, #f2f2f2 100%);	background-size: 18.00px 18.00px;	height: 80vh;    width: 67.5vw!important;  align-content: center;}
.slideContent.finalSlide  > div:before {content:url('clip-l-t.svg'); position:absolute; left: 30px; top: 50px;  transform: scale(3);}
.slideContent.finalSlide  > div:after{content:url('clip-l-b.svg'); position:absolute; left: 110px;  bottom: -10px;  transform: scale(3);}
.slideContent.finalSlide:before {content:url('clip-r-b.svg'); position:absolute; right: 160px; bottom: 60px;  transform: scale(3);}
 .slideContent.finalSlide { position: relative;}
 .slideContent.finalSlide > div > div {	background: #ffffff;	z-index: 800;	max-width: 520px;	padding: 55px;	margin: 0 0 0 80px;}

 /* Splash */
 #splash { margin: 0 0 200px 0; opacity: 1;  -webkit-transition: opacity 0.2s ease-in-out;  -moz-transition: opacity 0.2s ease-in-out;  -o-transition: opacity 0.2s ease-in-out;  transition: opacity 0.2s ease-in-out; }
 #splash #splashContent {  display: flex;  align-items: center;}
 #splash #splashContent > div {  width: 50%;}
 #splash #splashContent #splashIntro {background: #ffffff;   z-index:800;   max-width: 520px;  padding: 55px 55px 55px 0px;}
 #splash #splashContent #splashIntro  .heading {  padding: 0 0 0 55px;}
 #splash #splashContent #splashIntro .heading p, #splash #splashContent #splashIntro .heading h1 { max-width: 300px;}
#splash #splashGlyphs span { transform:scale(110%); max-width: 50%;  margin: 0 auto; display:inline-block;  display: flex;  flex-wrap: wrap;}
#splash #splashGlyphs span div {display:flex; width:100%; justify-content: space-between;}
#splash #splashGlyphs span div i { color: #fff; font-family: 'coveslight';   font-size: 24px; font-style:normal; width: 15px; height: 15px; padding: 55px 0;}
#splash #splashAnimation {opacity:0; width:84%!important; /* box-shadow: inset -25em -2em 35em 15em #1d1e22; */ position: absolute; background:url(backdrop4.jpg); background-position: right;  background-repeat: no-repeat; right: 0;  -webkit-clip-path:  polygon(0 0, 100% 0, 100% 89%, 50% 100%); clip-path:  polygon(0 0, 100% 0, 100% 89%, 50% 100%); transition: $ease; animation: poly 60s ease-in-out infinite;}
 #splash #splashGlyphs {position: absolute; z-index: 500; right: 0;  text-align: center;}
 #splash #splashGlyphs span, #splash #splashGlyphs span em {position:relative; color: #ffffff;}
 #splash #splashGlyphs span em {font-style:normal; text-align:center; }
 #splash #splashGlyphs span em.abglyph1:before {content:url("glyph1.gif");  position:absolute; top: 25px;left: -197px; animation: flickerLG 2s linear  infinite; }
 #splash #splashGlyphs span em.abglyph2:before {content:url("glyph2.gif");  position:absolute; top: -45px;left: -107px;  animation: flickerLG 2s linear  infinite; }
 #splash #splashGlyphs span em.abglyph3:before {content:url("glyph4.svg");  position:absolute; top: 45px;left: -177px; }
 #splash #splashGlyphs span em.abglyph4:before {content:url("glyph1.gif");  position:absolute; top: -45px;left: -177px; }
 #splash #splashGlyphs span em.abglyph5:before {content:url("glyph3.svg");  position:absolute; top: 75px;left: -97px; animation: flickerLG 2s linear  infinite;}
 #splash #splashGlyphs span em.abglyph6:before {content:url("glyph5.svg");  position:absolute; top: -45px;left: -121px; animation: flickerLG 2s linear  infinite;}
 #splash #splashGlyphs span em.abglyph7:before {content:url("glyph2.gif");  position:absolute; top: -5px;left: -57px; }
 #splash #splashGlyphs span em.abglyph8:before {content:url("glyph1.gif");  position:absolute; top: 65px;left: -67px; animation: flickerLG 2s linear  infinite;}
 #splash #splashGlyphs span em.abglyph9:before {content:url("glyph1.gif");  position:absolute; top: -45px;left: -57px; }
 #splash #splashGlyphs span em.abglyph1:after {content:url("glyph5.svg");  position:absolute; top: -15px;left: 57px; animation: flickerLG 2s linear  infinite;}
 #splash #splashGlyphs span em.abglyph2:after {content:url("glyph4.svg");  position:absolute; top: -85px;left: 37px; }
 #splash #splashGlyphs span em.abglyph3:after {content:url("glyph3.svg");  position:absolute; top: -85px;left: 57px; animation: flickerLG 2s linear  infinite;}
 #splash #splashGlyphs span em.abglyph4:after {content:url("glyph5.svg");  position:absolute; top: -125px;left: 7px; }
 #splash #splashGlyphs span em.abglyph5:after {content:url("glyph3.svg");  position:absolute; top: -105px;left: 97px; animation: flickerLG 2s linear  infinite;}
 #splash #splashGlyphs span em.abglyph6:after {content:url("glyph1.gif");  position:absolute; top: 67px;left: 97px; }
 #splash #splashGlyphs span em.abglyph7:after {content:url("glyph2.gif");  position:absolute; top: -45px;left: 107px; }
 #splash #splashGlyphs span em.abglyph8:after {content:url("glyph4.svg");  position:absolute; top: 5px;left: 57px;animation: flickerLG 2s linear  infinite; }
 #splash #splashGlyphs span em.abglyph9:after {content:url("glyph3.svg");  position:absolute; top: -145px;left: 57px; animation: flickerLG 2s linear  infinite;}
 
 .homeflight{position:relative;}
 .home #splash #splashContent #splashIntro  p.highlight {max-width:280px; letter-spacing:8px; margin: -8px 0 41px 0; color: #1d1e22;	font-size: 39px; line-height: 40px;	text-shadow: unset; }
 .home #splash #splashContent #splashIntro  small {text-transform:uppercase; display:block; margin: 0 0 10px 0; font-size:12px; letter-spacing: 2px; color:#535458;}
 .home.subSplash #splash #splashContent {  display: flex;  align-items: center;   flex-direction: unset; overflow-x:hidden;	}
 
.home #splash #splashAnimation { background:url(backdrop3.jpg); background-size: cover; background-repeat:no-repeat;}
.home #splash #splashContent #splashIntro  p.highlight:before {  content: url("/images/quote.svg");  position: absolute;  bottom: -25px;  right: -25px;  transform: scale(0.3);}
 
 @keyframes flickerLG {
	0% {
		opacity: 0.4;
	}
	5% {
		opacity: 0.5;
	}
	10% {
		opacity: 0.6;
	}
	15% {
		opacity: 0.85;
	}
	25% {
		opacity: 0.5;
	}
	30% {
		opacity: 1;
	}
	35% {
		opacity: 0.1;
	}
	40% {
		opacity: 0.25;
	}
	45% {
		opacity: 0.5;
	}
	60% {
		opacity: 1;
	}
	70% {
		opacity: 0.85;
	}
	80% {
		opacity: 0.4;
	}
	90% {
		opacity: 0.5;
	}
	100% {
		opacity: 1;
	}
}
 
 /* triGrid */
  .triGrid { padding: 0px 45px;}
.triGrid img {width:100%; display:block;}
.triGrid .row {  display: flex; }
.triGrid .row > div {flex: 0 0 33.333%; background:#ebebeb; display:flex; flex-wrap: wrap;  align-content: center;}
.triGrid .row > div:first-child {background:#ebebeb; }
.triGrid .row > div:last-child {background-image: linear-gradient(90deg, #dedede 11.11%, #f2f2f2 11.11%, #f2f2f2 50%, #dedede 50%, #dedede 61.11%, #f2f2f2 61.11%, #f2f2f2 100%);
background-size: 18.00px 18.00px; clip-path: polygon(0 0, 0% 100%, 100% 100%);}
 .triGrid .row.alt > div:first-child {background-image: linear-gradient(90deg, #dedede 11.11%, #f2f2f2 11.11%, #f2f2f2 50%, #dedede 50%, #dedede 61.11%, #f2f2f2 61.11%, #f2f2f2 100%);
background-size: 18.00px 18.00px;clip-path: polygon(0 0, 100% 100%, 100% 0);}
.triGrid .row.alt > div:last-child {clip-path:unset;}
.triGrid .row > div p{padding:0 15px  0 0;}
.triGrid .row.substitute1 > div ul.core { padding: 0 15px 0 0;}

.triGrid .row.substitute1 > div:first-child {background:#d9d9d9;}
.triGrid .row.substitute1 > div {background:#d3d7d8;}
.triGrid .row.substitute1 > div:last-child {background-image: linear-gradient(90deg, #dedede 11.11%, #f2f2f2 11.11%, #f2f2f2 50%, #dedede 50%, #dedede 61.11%, #f2f2f2 61.11%, #f2f2f2 100%);
background-size: 18.00px 18.00px; clip-path: polygon(0 0, 0% 100%, 100% 100%);}
.home .triGrid q strong strong, .home .triGrid q strong {font-weight:normal;}
.home .triGrid q:before, .home .triGrid q:after {display:none;}

/* distrupt banner */
#dbanner {background: #d3d7d8; flex-wrap: wrap;  margin: 120px 0 0 45px; display: flex; max-width: 920px;}
#dbanner div {flex:0 0 50%; position: relative;}
#dbanner div img {width:100%; position: absolute; top: -40px;  right: -40px;}
#dbanner p a img {  max-width: 32px;  position: relative;  margin: 0 12px 0 0;  top: 3px; right:unset;}
#dbanner p a:hover {text-decoration:none;}
#dbanner p { padding: 0px 44px 40px 44px;}
#dbanner .heading { margin: 40px 0 0 0;}
#dbanner .Art {max-width:390px;}

/* Subnav */
.subNav a, .subNav {letter-spacing: 6px; text-transform: uppercase; font-size: 11px;text-decoration:none;  /* font-weight: bold;*/ line-height:18px;}
.subNav ul { margin: 0 0 25px 0;}
.subNav img {max-height: 24px; max-width: 24px!important; top:2px; opacity:1; margin:-1px 28px 0px 0; -webkit-transition: opacity 0.2s ease-in-out 0s; -moz-transition: opacity 0.2s ease-in-out 0s; -o-transition: opacity 0.2s ease-in-out 0s; transition: opacity 0.2s ease-in-out 0s; position: absolute; left: -48px;}
.subNav ul li a{ margin:0;}
.subNav ul.social li {margin:0 12px  0 0;}
.subNav ul.social li.yt {margin:5px  0 0 0!important;}
.subNav li a:hover { color: #1d1e22; border-bottom: 1px solid #000;}
.subNav li a:hover img {opacity:0.7;}
.subNav ul li { margin: 0;  padding: 10px 0;}
.subNav ul.social {display:flex; align-items: center; position: relative;}
.subNav ul.social li img{max-height: 20px; max-width: 20px; position:static;}
.subNav ul li a { padding: 0 0 4px 0;display: flex;  border-bottom: 1px solid  transparent;   width: max-content;}
.subNav ul.action, .subNav ul.social, .subNav > span {padding:0 45px}
.subNav ul.action a { font-size: 14px; margin: 0 0 0 36px; position:relative;}
.subNav ul.action li { padding: 18px 0;}
.subNav > span { margin: 0 0 25px 0; display: block;  font-weight: bold;}
.subNav ul.action li:nth-child(3) img { transform: scale(1.7);}
.subNav ul.social a {  border: 0!important;}

.home .simpleBody {padding: 0px 45px 200px 45px; position:relative;}
.simpleBody {padding: 100px 45px 200px 0px; position:relative;}
.simpleBody > div {display:flex; gap:3%;}
.simpleBody > div p { flex:0 0 30%; padding: 0 0 0 45px;}

.simpleBody.videoPlayer video{ width: 100%;  height: auto;  display: block;}
.simpleBody.videoPlayer .videoPlayerWrapper {padding: 0 0 0 45px;} 

 /* clients and testimonials */
 #clients {padding:0 45px;}
 #clients .row { display: flex; align-items: center; }
 #clients .row > div {flex: 0 0 33.333%; align-content: center; }
#clients #testimonials .testimonials li {opacity:0; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; display:none; line-height: 25px; font-size: 16px;letter-spacing: 2px;}
#clients #testimonials .testimonials li.active {opacity:1;display:inline;}
#clients #testimonials .testimonials li.shortTestimonial p {font-size:26px; line-height:32px;}
#clients #clientLogos .clientLogos li {opacity:0; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; display:none; width: 100%; }
#clients #clientLogos .clientLogos li.active {opacity:1; display:inline;}
#clients #clientLogos .clientLogos  {position:relative; max-height:500px}
#clients #clientLogos .clientLogos li img  {padding:0;  margin:10% auto;}
#clients #clientLogos .clientLogos li p:first-child img {opacity:1; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s;}
#clients #clientLogos .clientLogos li p:nth-child(2) img{opacity:1; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s;  -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s;}
#clients #clientLogos .clientLogos li p:last-child img{opacity:1; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s;  -webkit-transition-delay: 0.3s; -moz-transition-delay: 0.3s; -o-transition-delay: 0.3s; transition-delay: 0.3s;}
#clients #clientLogos .clientLogos li.transition p:first-child img {opacity:0; padding:0 0 0 25px;}
#clients #clientLogos .clientLogos li.transition p:nth-child(2) img  {opacity:0; padding:0 0 0 25px;}
#clients #clientLogos .clientLogos li.transition p:last-child img {opacity:0;padding:0 0 0 25px;}
 #testimonials {padding: 0 2%; min-height:60vh;}
 #testimonials .testimonials { max-width: 345px;   margin: 0 auto; position:relative;}
 #testimonials .testimonials span {clear:both;  display: block; position:relative;}
 #testimonials .testimonials li > span { margin:50px 0 0 0;}
 #testimonials .testimonials li > span:before {content:url("/images/quote.svg");  position:absolute; top: -45px;left: -57px; transform:scale(0.3);}
 #testimonials .testimonials span span {line-height: 27px; padding-top: 27px; letter-spacing: 7px; text-transform: uppercase;font-size: 12px;}
 #clients #clientLogos .clientLogos li p {text-align:center; display:flex; flex-wrap:wrap; width:100%;}
 
 
 .notHome .heading { padding: 0 0 0 45px; position: relative;}
 .notHome  .heading h1, .notHome  .heading h2 { letter-spacing: 7px; font-size: 16px; /* font-weight:bold; */ width:100%; font-family: 'coveslight'; text-transform:uppercase;  margin: 0 0 35px 0;}
  .notHome .heading h1:before, .notHome .heading h2:before, #similarProducts h3:before { background-color: #1d1e22;  position: absolute;   content: "";  width: 3px;  height: 32px;   left: 0px;   top: -6px;   display: block;}
  .notHome .heading p {  max-width: 400px; margin: 0 0 40px 0;}
 .notHome .heading span {cursor:pointer; border-bottom: 1px solid #000;}
 
 .projectFilters,  .shopFilters  { display: flex; justify-content: end;}
.shopFilters {margin-bottom: 60px;}
 .projectFilters .subNav{ padding: 80px 235px 0 0;}
 .shopFilters .subNav { padding: 80px 245px 0 0;}
 .projectFilters .subNav li,  .shopFilters .subNav li  {  padding: 3px 0;}
 .projectFilters span,  .shopFilters span {display:none;}
 .triGrid .subNav > span span { display: none;}
 .triGrid .heading span {border:0;}
 
 
/* PROJECT PAGE */
.propertyTiles{padding: 48px;}
.propertyTiles .row { display: flex;  gap: 17px;}
.propertyTiles .propertyTile p { padding: 0 13px 0 0;}
.propertyTiles .propertyTile.portrait { width:25%;}
.propertyTiles .propertyTile.landscape { width:50%;}
.propertyTiles .propertyTile.landscape p { width:66%;}
.propertyTiles .propertyTile img {width:100%; max-width:100%; display:block; -webkit-transition: transform 0.2s ease-in-out, margin 0.2s ease-in-out, clip-path 0.2s ease-in-out 0s; -moz-transition: transform 0.2s ease-in-out, margin 0.2s ease-in-out}
.propertyTiles .propertyTile img:hover {/*transform:translateX(-3px); */}
.propertyTiles .propertyTile a p span img {width:auto; margin:2% 0;}
.propertyTiles .propertyTile a > em {background:#ebebeb;}
.propertyTile { padding:0 26px 80px 0;}
.propertyTile a {text-decoration:none;}
.propertyTile  a span { font-size: 11px; letter-spacing: 4px;  padding: 0 0 12px 0;  display: inline-block;}
.propertyTile h3 {letter-spacing: 5px; margin: 28px 0 0 0; text-transform: uppercase;  font-size: 12px; font-family: 'coveslight';}
.propertyTile h2 {width: 100%;  max-width: unset; color: #1d1e22;  font-family: 'glyphalt65bold'; text-align: left; margin: 1rem 0 0 0; font-size: 20px; letter-spacing: 1px;  display: inline-block;}
.projects .slider  { padding: 0 0 0px 80px;}

/* BLOG PAGE */

.blog .propertyTile { flex: 0 0 33%;}
.blog .sendbutton {  padding:0 48px;}
.blog .loading { color:#1d1e22; cursor:default;}
.blog .sendbutton #loadMoreBtn {cursor: pointer;position: relative;display: block;width: 100%;height: 100%;letter-spacing: 2px;text-transform: uppercase;color: #eaebec;font-size: 14px;text-align: center;line-height: 43px;background: transparent;}
.blog .sendbutton .button.altbutton:hover span button { color: #1d1e22!important;}
#postLoop {  padding: 150px 45px;}
#postLoop {padding:100px 48px;}
#postLoop .latestContent {justify-content: flex-start; width: 70.5vw !important; display: flex!Important; align-items: center;}
#postLoop .latestCaption { width: 100%; padding: 55px;  opacity: 1;  transform: translateY(0px); display: flex;  flex-wrap: wrap; align-content: center; margin-top: -90px;}
#postLoop .latestCaption h3 { margin: 0 0 40px 0;font-family:'glyphalt65bold'; color:#1d1e22; font-size:37px;}
#postLoop .latestCaption h4 {letter-spacing: 5px;  margin: 28px 0; text-transform: uppercase;  font-size: 12px;  font-family: 'coveslight';  font-weight: bold;     flex: 0 0 100%;}
#postLoop .latestCaption > span { letter-spacing: 5px;  text-transform: uppercase;  font-size: 12px; font-family: 'coveslight'; writing-mode: vertical-rl;   font-weight: bold;   position: absolute;   left: -496px;  bottom: 0;}
#postLoop .latestCaption > span em {margin: 0 1em;   font-style: normal;   font-size: 17px;   position: relative;  left: 3px;}
#postLoop .latestCaption p {   padding: 0 40% 0 0;}

#postLoop .latestCaption p strong strong, #postLoop .latestCaption p  strong {font-weight:normal;}
#postLoop .latestCaption p strong.captionOverflow strong {display:none;}
#postLoop .latestCaption p strong.captionOverflow:after {content:"...";}

#postLoop .latestContentInner { display: flex; background: #ffffff;}
#postLoop .latestImages {flex:0 0 45%;}
#postLoop .latestImages img {display:block; width:100%; position: relative; top:0; left:0;clip-path: polygon(0% 0%,0% 0%,100% 0%,100% 100%,100% 100%,0% 100%);  -webkit-transition: transform 0.2s ease-in-out, margin 0.2s ease-in-out, clip-path 0.2s ease-in-out 0s; -moz-transition: transform 0.2s ease-in-out, margin 0.2s ease-in-out, clip-path 0.2s ease-in-out 0s; -o-transition: transform 0.2s ease-in-out, margin 0.2s ease-in-out, clip-path 0.2s ease-in-out 0s; transition: transform 0.2s ease-in-out, margin 0.2s ease-in-out, clip-path 0.2s ease-in-out 0s;  -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s;}

.blog #blogfilter {padding: 0 55px 0px 45px;   }
.blog #blogfilter > div { align-items: center; border-top: 1px solid #1d1e22; border-bottom: 1px solid #1d1e22; padding: 22px 0;  width: 100%; display: flex;  flex-flow: row-reverse;  flex-wrap: nowrap;}
.blog #blogfilter > div > div { position: relative;  text-align: right;}
.blog #blogfilter > div > div.mostread { text-align: left;}
.blog #blogfilter > div > div.archive	{ flex: 1;}
.blog #blogfilter a { letter-spacing: 2px; line-height: 23px; font-size: 14px;  text-shadow: 0.2px 0.2px 0.5px #1d1e22;  text-decoration: none;}
.blog #blogfilter a:hover {text-decoration:underline;}
.blog #blogfilter .archive ul {max-height: 30px; z-index: 400; overflow: hidden;  -webkit-transition: max-height 0.3s ease-in-out 0s; -moz-transition: max-height 0.3s ease-in-out 0s; -o-transition: max-height 0.3s ease-in-out 0s; transition:max-height 0.3s ease-in-out 0s; position: absolute;  right: -2px;  top: -14px;}
/*.blog #blogfilter .archive ul.reveal {height:auto; overflow:visible;}*/
.blog #blogfilter .archive ul li:first-child, .blog #blogfilter .mostread ul li:first-child { text-shadow: unset;  letter-spacing: 6px; padding: 0 0 4px 0;  text-transform: uppercase;  font-size: 11px;  text-decoration: none;border-bottom: 1px solid transparent;  display: inline-block; cursor:pointer;  line-height: 18px; margin: 0 0 25px 0;}
.blog #blogfilter .random {width:160px; text-align: left; margin: 0 30px 0 0;}
.blog #blogfilter .random a{ text-shadow: unset;  letter-spacing: 6px;  padding: 0 0 4px 0;  text-transform: uppercase; font-size: 11px;  text-decoration: none;  border-bottom: 1px solid transparent;  display: inline-block;   cursor: pointer;    line-height: 18px;   margin: 0;}

.blog #blogfilter .archive ul li:first-child:hover, .blog #blogfilter .random a:hover, .blog #blogfilter .mostread ul li:first-child:hover {  color: #1d1e22;  border-bottom: 1px solid #000;}
.blog #blogfilter .archive li.year { letter-spacing: 6px;  padding: 15px 19px 15px 19px!important;  text-transform: uppercase;  font-size: 11px;  text-decoration: none;  border-bottom: 1px solid transparent;  display: block;   line-height: 18px;  background: #f2f2f2;  width: 560px;}
.blog #blogfilter .archive li:not(:first-child) {background: #f2f2f2;  width: 560px; padding: 0  19px;}
 .blog #blogfilter > div > div.mostread small { display: block;  text-transform: uppercase;  letter-spacing: 6px; font-size: 8px;  text-shadow: 0.2px 0.2px 0.5px #1d1e22;}
  .blog #blogfilter > div > div.mostread {padding:0 80px 0 0;}
 
 
.textOnly2Col {padding:100px 90px 100px 90px; display: flex;  gap: 25px;  justify-content: end;} 
.textOnly2Col > div {  flex: 0 0 20%;}
.textAndImage2Col {padding:0 45px;  display: flex;  gap: 85px;} 
.textAndImage2Col > div:last-child {width:100%; max-width:950px}
.textAndImage2Col > div:first-child { /* order: 2; */ }
  
#intro {opacity:0; display: flex; align-content: center;  flex-wrap: wrap;  margin: 170px 0 0 0; padding:0 45px  0 0;   justify-content: end;}
#intro >div:first-child {flex: 0 0 428px;  display: flex;  align-content: center;  flex-wrap: wrap;} 
#introCaption{padding: 55px; background:#ffffff; width: 100%; position: relative;}
#introCaption h1 {margin: 0 0 40px 0; font-family: 'glyphalt65bold';  color: #1d1e22;  font-size: 37px;}
#introCaption h2 {  letter-spacing: 7px;  font-size: 16px; line-height: 25px;  width: 100%;  font-family: 'coveslight';  text-transform: uppercase;  margin: 0 0 35px 0;}
#introCaption h4 {letter-spacing: 5px;  margin:0 0 28px 0; text-transform: uppercase;  font-size: 12px;  font-family: 'coveslight';  font-weight: bold;}
#intro >div:last-child {position:relative;  flex: 0 0 100%;  max-width: 700px; overflow:hidden;}
#intro >div:last-child img {width:100%; clip-path: polygon(100% 0, 100% 90%, 90% 100%, 0 100%, 0 0); display:block;}
#intro >div:last-child span {display: block;   height: 100%;  position: absolute;  left: 0; bottom:90px;  width: 90%; background-image: linear-gradient(90deg, #dedede 11.11%, #f2f2f2 11.11%, #f2f2f2 50%, #dedede 50%, #dedede 61.11%, #f2f2f2 61.11%, #f2f2f2 100%);background-size: 18.00px 18.00px;clip-path: polygon( 100% 45%, 0 0, 0 100%);} 
#portfolio #intro >div:last-child span { bottom: 0px; top: unset;}
 
.grid_imgGrid { display: grid; grid-template-columns: repeat(6, 1fr); grid-template-rows: repeat(4, 1fr); grid-column-gap: 25px; grid-row-gap: 25px; padding:0 45px 0 0;}
.grid_imgGrid img {width:100%;}
.grid_imgGrid .img1 { grid-area: 1 / 4 / 4 / 7; transform: translate3d(0px, 5px, 0px);}
.grid_imgGrid .img2 { grid-area: 2 / 1 / 4 / 3; }
.grid_imgGrid .img3 { grid-area: 2 / 3 / 3 / 4; }
.grid_imgGrid .img4 { grid-area: 3 / 3 / 4 / 4;     transform: translate3d(0px, -5px, 0px);}
.grid_imgGrid .img5 { grid-area: 4 / 1 / 5 / 2; }
.grid_imgGrid .img6 { grid-area: 4 / 4 / 5 / 6; }
.grid_imgGrid .img7 { grid-area: 1 / 1 / 2 / 4;  padding: 0 0 20px 0;  display: flex;  align-items: flex-end;  justify-content: end;}
.about .grid_imgGrid .img6 p , .about .grid_imgGrid .img7 p { color: #1d1e22;  font-size: 39px;  line-height: 40px; max-width: 410px;}
 
 
.blogsocial { column-span: all; border-bottom:1px solid #1d1e22; padding:22px 0; width:100%; text-align:right; }
.blogsocial .resp-sharing-button__link,.blogsocial .resp-sharing-button__icon {  display: inline-block;}
.blogsocial .resp-sharing-button__link {text-decoration: none; color: #fff; margin: 0.5em}
.blogsocial .resp-sharing-button { border-radius: 5px; transition: 25ms ease-out; padding:0.5em 0.6em 0.0em 0.6em;}
.blogsocial .resp-sharing-button__icon svg { width: 1em; height: 1em; vertical-align: top}
.blogsocial .resp-sharing-button--small svg { margin: 0; vertical-align: middle}
.blogsocial .resp-sharing-button__icon { stroke: #30343b; fill: none}
.blogsocial .resp-sharing-button__icon--solid,.blogsocial .resp-sharing-button__icon--solidcircle { fill: #30343b; stroke: none}
.blogsocial .resp-sharing-button--facebook:hover,.blogsocial .resp-sharing-button--facebook:active { opacity:0.5;}
.blogsocial .resp-sharing-button--twitter:hover,.blogsocial .resp-sharing-button--twitter:active { opacity:0.5;}
.blogsocial .resp-sharing-button--pinterest:hover,.blogsocial .resp-sharing-button--pinterest:active { opacity:0.5;}
.blogsocial .resp-sharing-button--linkedin:hover,.blogsocial .resp-sharing-button--linkedin:active { opacity:0.5;}
.blogsocial p {  display: inline;  position: relative;  top: -4px;}
.blogsocial .blogLink { float: left;  top: 12px; padding: 0 0 0 18px;}
.blogsocial .blogLink a {text-decoration:none;}
.blogsocial .blogLink:before {  content: "<";  position: absolute;  top: -5px;  font-size: 11px;  padding: 6px 3px 3px 16px;  letter-spacing: 4px;  left: -13px;  z-index: 10;}
#blogpost #intro >div:first-child {flex: 0 0 500px;}
 
 
.post .blogFlyout {opacity:0; background: #d9d9d9;  padding: 55px;  position:absolute; width:450px; top:120px; left:45px;  align-items: center; border-top-width:3px; border-left-width:3px;border-right-width:3px;border-bottom-width:3px; border-style:solid; border-color:#d9d9d9;  z-index: 500;}
.post .blogFlyout.active{animation: flyout 0.75s linear forwards; }
.post .blogFlyout .button {  margin: 25px  0 0 0;}
.post .blogFlyout div { flex: 0 0 60%;}
.post .blogFlyoutContainer h2 {    letter-spacing: 7px;   font-size: 16px;  width: 100%;   font-family: 'coveslight';   text-transform: uppercase;   margin: 0 0 35px 0;}
.post .blogFlyoutContainer .nextProject::before {right:24px; }
.post .passage { align-items: center;  display: flex;   margin: 100px 15% 100px 0;}
.post .passage > div { width: 50%;}
.post .passage div p {margin:0 0 30px 0;}
.post .blogFooter {padding: 0 45px;}
.post .blogFooter .blogsocial {  border-top: 1px solid #1d1e22;}
.post .blogFlyoutContainer { min-height:430px; position: relative;     display: flex;    justify-content: end;}
.post .passage > div img {  max-width: 480px;   margin-right: 45px;}
.post .passage > div:first-child {  justify-content: end;  display: flex;  align-items: start;  padding: 0 0 0 45px;}
.post .postnavigation img { max-width: 200px; padding:0;}
.post .postnavigation td {position:relative; vertical-align: top;  min-height: 210px; width: auto; display: flex; flex-direction: column; align-items: flex-start;}
.post .postnavigation tr { display: flex; justify-content: space-between;}
.post .postnavigation td a:last-child {  width: 95%;  display: inline-block;}
.post .postnavigation h2 {max-width:unset; padding:0;margin: 0 auto 45px 0;}
.post .postnavigation img {z-index:20; position:relative;top: -10px; }
.post .postnavigation { max-width: 440px; position:relative;  margin: 70px 45px 0 0;}
.post .prevProject img {left:0;}
.post .nextProject img {right:0;}
.post .prevProject img, .post .nextProject img{ -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s;}
.post .nextProject:before { -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; content: "Next >"; position: absolute; top: -22px; font-size: 9px;  padding: 4px 11px 6px 10px;  -webkit-box-shadow: 0px 0px 3px 1px rgb(222 222 222);  box-shadow: 0px 0px 3px 1px rgb(222 222 222);  border-radius: 8px;  letter-spacing: 4px; right: 21px;  background:#eaebec;  z-index: 10; clip-path: polygon(0% 0%,0% 0%,80% 0%,100% 80%,100% 100%,0% 100%);}
.post .prevProject:before{  -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; content:"< Prev"; position: absolute;  top: -22px;  font-size: 9px; padding: 4px 3px 3px 16px; -webkit-box-shadow: 0px 0px 3px 1px rgb(222 222 222);  box-shadow: 0px 0px 3px 1px rgb(222 222 222);   border-radius: 8px;  letter-spacing: 4px; left: 0px; background: #eaebec;  z-index: 10; clip-path:polygon(20% 0%,0% 0%,0% 0%,100% 0%,100% 100%,0% 100%);}
.post .nextProject, .post .prevProject{margin:12px 12px 0px 0px; }
.post .prevProject:hover img{position:relative; left:-5px; max-width:205px!important;}
.post .nextProject:hover img{position:relative; right:-5px; max-width:205px!important;}
.post .prevProject:hover:before, .post .nextProject:hover:before{opacity:0;}
.postarticle .good {background: #54e0af none repeat scroll 0 0; border-radius: 7px; color: #ffffff!important; font-weight:500; font-size: 12px; padding: 5px;}
.postarticle .bad {background: #EA4335 none repeat scroll 0 0; border-radius: 7px; color: #ffffff!important; font-weight:500; font-size: 12px; padding: 5px;}
.post .twitter-tweet iframe{ margin: 50px 0;}
.post .blogcaption{ color: #727272;  display: block;  margin: 0 0 30px;  text-align: left !important;}
.post .snippet, .post .twitter-tweet { background: #e5e5e5 none repeat scroll 0 0;  font-family: courier,courier new,times new roman,serif;  display: grid;   margin: 0px 0 23px 0;   padding: 35px;}
.post .postnavigation td a {letter-spacing: 7px;    text-transform: uppercase;    font-size: 11px;    text-decoration: none;     line-height: 18px;     padding: 0 0 4px 0; }
.post .postnavigation td:hover a:last-child {  color: #1d1e22; }
.post .postnavigation td a:last-child:after {display:none;}
.post .postnavigation td:hover a:last-child:after {border-bottom: 2px solid #5eb4ef;  content: "";  display: block;  width: 13px;  position: absolute; bottom: 0;}
 
.subSplash #splash #splashContent  {display: flex;  align-items: start;  flex-direction: column;}
 
 #direct .heading {margin: 0 0 0 -57px;}
 #direct .heading p {max-width:unset; margin: 0 0 20px 0;}
 #direct h3 {color:#1d1e22; font-size:13px; letter-spacing: 2px;  font-family: 'coveslight';   text-transform: uppercase; margin:0 0 35px 0;}
 #direct #formLoad { margin: 30px 0 0 -12px; }
 #direct {background: #ffffff;  margin:12.6rem 2rem 2rem 45px!important;  width:80%; z-index:800; max-width:790px;}
 .directInner {  padding: 55px;}
 .directInner .subNav ul.action {padding:0;}
#direct form {  margin: 35px 0 10px -12px;}
#direct + #direct {  margin: -4.4rem 0 2rem 45px !important;}
.formhere + .heading {margin:80px 0 0 -57px!important;}

#direct p, #direct ul {  margin: 0 0 0 -12px;}
.showcaseItem  #direct + #direct { margin:2.6rem 2rem 2rem 33px!important;}
.directOrganise { display: flex; align-items: flex-start;}
 .directOrganise > section {width:50%;  padding: 55px;}

.project-close #direct .inputText {  padding: 3px 7px 0px 200px;}
.project-close #direct .newsletterOnboard{background:#d3d7d8; padding: 52px; display: flex;  margin: 40px 0 40px -12px;}
.project-close #direct .newsletterOnboard > div:first-child em{font-size:26px; line-height:32px; font-style:normal;  margin: 0 0 22px -13px;    display: block; }
.project-close #direct .newsletterOnboard > div:first-child a {margin:25px  0 0 -13px;}
.project-close #direct .newsletterOnboard > div:last-child{position:relative; flex:60%;}
.project-close #direct .newsletterOnboard > div:first-child {flex:40%;}
.project-close #direct .newsletterOnboard > div:last-child img {position:absolute; bottom:0;z-index:2; left:40%; transform-origin:bottom left; transform:scale(0.65); opacity: 0; } .project-close #direct .newsletterOnboard > div:last-child img.active{animation: fadeInLeftMid 1s ease forwards; animation-delay: 0.3s;}
.project-close #direct .newsletterOnboard > div:last-child img:first-child {z-index:3; left:10%; transform:scale(0.7); transform-origin:bottom left;}
 .project-close #direct .newsletterOnboard > div:last-child img.active:first-child{ animation: fadeInLeftFirst 1s ease forwards; animation-delay: 0s;}
.project-close #direct .newsletterOnboard > div:last-child img:last-child {z-index:1; left:70%; transform:scale(0.6); transform-origin:bottom left;}
 .project-close #direct .newsletterOnboard > div:last-child img.active:last-child{ animation: fadeInLeftLast 1s ease forwards; animation-delay: 0.6s;}
.project-close #direct  .subNav {padding:25px 0 0 0;} 
.project-close #direct  .subNav ul.action, .project-close #direct  .subNav ul.social,   .project-close #direct .subNav > span {   padding: 0;}
.project-close #direct  .subNav > span { margin: 0 0 25px -10px;}
.project-close #direct .returnsuccess{margin: 40px 0 14px -11px;}

@keyframes fadeInLeftFirst {
    0% {  opacity: 0; left: 0%;  }
    100% { opacity: 1;  left: 10%; }
}
@keyframes fadeInLeftMid{
    0% { opacity: 0;  left: 30%; 
    }
    100% {  opacity: 1;  left: 40%; 
    }
}

@keyframes fadeInLeftLast {
    0% {opacity: 0; left: 60%; 
    }
    100% {   opacity: 1;  left: 68%; 
    }
}


.newsletter article .newsletterShowcase {  display: flex; width:0%; top:0; position:fixed; z-index:500; overflow-y: auto; background: #f2f2f2; height:100vh; opacity:0; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; z-index:1000;}
.newsletter article.showcase .newsletterShowcase {opacity:1; width:calc(100% - 265px);}
.newsletter .newsletterShowcase .showcaseItem {  padding: 3rem;   display: flex;   flex-wrap: wrap;   align-items: center;  opacity: 0;   animation: showcaseItem 1.5s ease forwards;}
.newsletter .returnsuccess{margin: 0 0 14px -11px;}
.newsletter .whatnext h2 {    letter-spacing: 7px;  font-size: 16px; margin:50px 0 21px -11px;  width: 100%;  font-family: 'coveslight';   text-transform: uppercase;}
.newsletter .whatnext .button {  margin: 22px 0 22px -13px !important;}
.newsletter .newsletterOnboard {display:flex;}
.newsletter .newsletterOnboard  .inputText {  padding: 3px 7px 0px 200px;}
.newsletter  .newsletterOnboard{background:#d3d7d8; padding: 52px;  margin: 40px 0 40px -12px;}
.newsletter  .newsletterOnboard > div:first-child em{font-size:26px; line-height:32px; font-style:normal;  margin: 0 0 22px -13px;    display: block; }
.newsletter  .newsletterOnboard > div:first-child a {margin:25px  0 0 -13px;}
.newsletter  .newsletterOnboard > div:last-child{position:relative; flex:60%;}
.newsletter  .newsletterOnboard > div:first-child {flex:40%;}
.newsletter  .newsletterOnboard > div:last-child img {position:absolute; bottom:0;z-index:2; left:40%; transform-origin:bottom left; transform:scale(0.65); opacity: 0; } 
.newsletter  .newsletterOnboard > div:last-child img.active{animation: fadeInLeftMid 1s ease forwards; animation-delay: 0.3s;}
.newsletter  .newsletterOnboard > div:last-child img:first-child {z-index:3; left:10%; transform:scale(0.7); transform-origin:bottom left;}
 .newsletter  .newsletterOnboard > div:last-child img.active:first-child{ animation: fadeInLeftFirst 1s ease forwards; animation-delay: 0s;}
.newsletter  .newsletterOnboard > div:last-child img:last-child {z-index:1; left:70%; transform:scale(0.6); transform-origin:bottom left;}
 .newsletter  .newsletterOnboard > div:last-child img.active:last-child{ animation: fadeInLeftLast 1s ease forwards; animation-delay: 0.6s;}



@keyframes showcaseItem {
0% {  opacity: 0;}
30% {  opacity: 0; }
100% {  opacity: 1;}
  }
.newsletter #direct .button {  margin: 12px 0;}
.newsletter .newsletterShowcase  span.scTrigger {color:#30343b;padding-left: 22px; z-index:400; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; cursor:
 pointer; font-size: 32px; position: fixed; left: 266px; top: 4px;}
.newsletter .newsletterShowcase  span.upTrigger {color:#30343b;padding-left: 22px; z-index:400; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; cursor: pointer; font-size: 29px; position: fixed; left: 281px;  top: 38px;  transform: rotate(90deg);}
.newsletter .newsletterShowcase span.scTrigger:hover { padding-left: 16px;}
.newsletter .newsletterShowcase span.upTrigger:hover { top: 32px;}
.newsletter .newsletterShowcase .showcaseItem > div {  width: 50%;}
.newsletter .newsletterMail {opacity:0; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}
.newsletter .newsletterMail p a, .newsletter .newsletterMail p span a {text-shadow: unset;}
.newsletter .newsletterMail.loademail{opacity:1;}
.newsletter .newsletterNav { padding: 100px;}
.newsletter .emailNav ul li{width: max-content; letter-spacing: 3px; text-transform: uppercase;  font-size: 12px; position:relative; cursor:pointer; padding: 12px 0;}
.newsletter .emailNav ul li:after { position: absolute;  content: "";  width: 2px;  height: 2px;  left: 0;  bottom: 0px;}
.newsletter .emailNav ul li:hover{color: #858382;}
.newsletter .emailNav ul li:hover:after { width: 100%;   height: 2px; outline: 0;  background-color: #858382;  -webkit-transition: all 0.2s ease 0s;  -moz-transition: all 0.2s ease 0s;  -ms-transition: all 0.2s ease 0s;  -o-transition: all 0.2s ease 0s;  transition: all 0.2s ease 0s;}
.newsletter .emailNav ul li.active:before { border-bottom: 2px solid #5eb4ef;  content: "";  display: block;  width: 13px;  position: absolute;  left: -1px;  bottom: 0;}
.newsletter  .theNewsletter .ibta, .newsletter .theNewsletter .ibta span, .newsletter .theNewsletter .ibta td, .newsletter .theNewsletter .ibta p, .newsletter .theNewsletter .ibta strong {  font-size: 13px;  color: #ffffff!important;}
 .newsletter .theNewsletter .ibta em,  .newsletter .theNewsletter .tct em {  font-size: 15px;  color: #ffffff!important;}
.newsletter .theNewsletter .tct a, .newsletter .theNewsletter .ibta a, .newsletter .theNewsletter .ibta strong{ font-size: 14px;}
.newsletter .theNewsletter .tct strong {color:#ffffff;}
.newsletter .theNewsletter .pat td{text-shadow:0.2px 0.2px 0.5px #1d1e22; font-size: 16px!important; line-height:22px; letter-spacing:2px;}
.newsletter .theNewsletter .tctHead p {font-family: 'glyphalt65bold', Arial, Helvetica, sans-serif;  font-size: 23px; line-height: 44px;}
.newsletter .theNewsletter p a {text-shadow:none;}
.newsletter .theNewsletter .ibta a, .newsletter .theNewsletter .tct a{font-weight:normal!important;}
 
.instagram .instagramLinks {  margin: 0 0 0 -12px;}
.instagram .instagramLinks a {height:auto;}
.instagram .instagramLinks .button {margin:12px 0;}
.instagram .instagramLinks li a {padding: 0 0 18px 0;  display: flex;  border-bottom: 1px solid transparent;  width: max-content;  letter-spacing: 7px;  text-transform: uppercase;  font-size: 11px;  text-decoration: none;  line-height:18px;}
.instagram .instagramLinks li a:hover { color: #1d1e22; border-bottom: 1px solid #000;}
.instagram .instagramLinks ul { margin: 30px 0 0 5px !important;}

#unsubscribe .sendbutton {  padding: 40px 0 0 0;}
.unsubscribe .returnsuccess {  margin: 35px 0 35px -10px;}
.unsubscribe .whatnext h2 {letter-spacing: 7px;	font-size: 16px; width: 100%;	font-family: 'coveslight';	text-transform: uppercase;	margin: 0 0 35px -10px;	line-height: 25px;}
.unsubscribe .whatnext .button {margin: 20px 0 20px -12px;}

#spotlight {display:flex; margin: 200px 0; padding: 0 45px;}
#spotlight > div:nth-child(2) {flex:0 0 140px; background:#2d50b6; height:519px;justify-content: center;  display: flex;  flex-wrap: wrap;  align-content: flex-start;  position: relative; order:3;}
#spotlight > div:nth-child(2) h2{	letter-spacing: 7px;	color: #ffffff;	font-weight: normal;	font-size: 16px;	width: 100%;	font-family: 'coveslight';	text-transform: uppercase;	margin: 0 0 35px 0;	padding: 35px 0;	max-width: unset;	line-height: 23px;	transform: rotate(90deg);	white-space: nowrap;  position: absolute; text-align: center; bottom: 200px;}
#spotlight > div:first-child {flex:0 0 460px;  position: relative; align-content: flex-end;}
#spotlight > div:last-child {flex-grow: 1; padding:65px 50px 0px 50px; position:relative; background:#2f3f58;}
#spotlight > div:last-child h2 {font-size: 27px;  text-decoration: none;  text-transform: none;  color: #ffffff;  font-family: 'glyphalt65bold';  letter-spacing: 2px;  width: max-content;}
#spotlight > div:last-child p {max-width:530px;  padding: 25px 0;  color: #fff;}
#spotlight > div:last-child ul {padding:20px 0;}
#spotlight > div:last-child li {max-width:530px;  padding: 15px 0 0 15px;  color: #fff; letter-spacing: 2px;  line-height: 23px;  font-size: 14px; position:relative;}
#spotlight > div:last-child li:before {content:""; display:block; border-radius:50%; height:8px; width:8px; background: #dff7f6; position:absolute; left: -3px;  top: 23px;}
#spotlight > div:first-child img { display: block;}
#spotlight > div:last-child > span {display: block;  height: 100%;  position: absolute;  right: 0;  width: 200px;  background-image: linear-gradient(90deg, #455e87 11.11%, #304567 11.11%, #304567 50%, #304567 50%, #455e87 61.11%, #304567 61.11%, #304567 100%);  background-size: 18.00px 18.00px;  clip-path: polygon( 100% 0%, 0 0, 0 100%);  bottom: 0px;  top: unset;  transform: rotate(180deg);  z-index: 80;  height: 200px;} 

#spotlight > div:nth-child(2) img {  margin: 50px 0;}
#spotlight > div:first-child > span {display: block;  height: 100%;  position: absolute; right: 0;  width: 70%;  background-image: linear-gradient(90deg, #455e87 11.11%, #304567 11.11%, #304567 50%, #304567 50%, #455e87 61.11%, #304567 61.11%, #304567 100%);  background-size: 18.00px 18.00px;  clip-path: polygon( 100% 45%, 0 0, 0 100%);  bottom: 0px;  top: unset; transform: rotate(180deg);  z-index: -1;} 
#spotlight .spotlightLogo {width:100px;  height: 100px;  display: flex;  background: #2d50b6;  position: absolute;  bottom: -50px;align-items: center;  justify-content: center;}
#spotlight .spotlightLogo img {max-width:100px;}
#spotlight .button {background: #dff7f6; margin: 35px 0;}
#spotlight .button span {color:#1d1e22;}
#spotlight .button:hover{background:#ffffff;}
#spotlight .button:hover span {color:#1d1e22 !important;}

#splashGrid {display: grid; grid-template-columns: repeat(5, 1fr); grid-template-rows: repeat(5, 1fr); grid-column-gap: 0px; grid-row-gap: 0px;}
.splashGrid1 { grid-area: 1 / 1 / 2 / 2; }
.splashGrid2 { grid-area: 1 / 2 / 2 / 3; }
.splashGrid3 { grid-area: 1 / 3 / 2 / 4; }
.splashGrid4 { grid-area: 1 / 4 / 2 / 5; }
.splashGrid5 { grid-area: 1 / 5 / 2 / 6; }
.splashGrid6 { grid-area: 2 / 1 / 3 / 2; }
.splashGrid7 { grid-area: 2 / 2 / 3 / 3; }
.splashGrid8 { grid-area: 2 / 3 / 3 / 4; }
.splashGrid9 { grid-area: 2 / 4 / 3 / 5; }
.splashGrid10 { grid-area: 2 / 5 / 3 / 6; }
.splashGrid11 { grid-area: 3 / 1 / 4 / 2; }
.splashGrid12 { grid-area: 3 / 2 / 4 / 3; }
.splashGrid13 { grid-area: 3 / 3 / 4 / 4; }
.splashGrid14 { grid-area: 3 / 4 / 4 / 5; }
.splashGrid15 { grid-area: 3 / 5 / 4 / 6; }
.splashGrid16 { grid-area: 4 / 1 / 5 / 2; }
.splashGrid17 { grid-area: 4 / 2 / 5 / 3; }
.splashGrid18 { grid-area: 4 / 3 / 5 / 4; }
.splashGrid19 { grid-area: 4 / 4 / 5 / 5; }
.splashGrid20 { grid-area: 4 / 5 / 5 / 6; }
.splashGrid21 { grid-area: 5 / 1 / 6 / 2; }
.splashGrid22 { grid-area: 5 / 2 / 6 / 3; }
.splashGrid23 { grid-area: 5 / 3 / 6 / 4; }
.splashGrid24 { grid-area: 5 / 4 / 6 / 5; }
.splashGrid25 { grid-area: 5 / 5 / 6 / 6; }


#portfolio #introCaption img { max-width: 100px; position: absolute;  margin: 45px;   bottom: 0;   right: 0;}
#portfolio #introCaption { padding: 55px 55px 125px 55px;  position: relative;min-height: 590px;}
#portfolio .chapter {margin:200px 0 0; display:inline-block; width: 100%;}
#portfolio .chapter .heading{margin:0 0 100px 0;}

#portfolio .chapter.headReduce {}
#portfolio .chapter.headReduce .heading {margin:0;}
#portfolio .chapter .slider {padding:0 0 0 45px; overflow:hidden;}
#portfolio .chapter .slider .slideContent {height:100vh; align-items:start; padding: 0 35px;}
#portfolio .chapter .slider .slideContentInner {flex: 1;  max-width: 95%; justify-content: space-between;  display: flex;  background: transparent;}
#portfolio .chapter .slider .slideContentInner img { width: 100%;}
#portfolio .chapter .slider .slideContentInner h3 {letter-spacing: 7px;  line-height: 25px;  font-size: 15px;    font-weight: bold;    wdth: 100%;    font-family: 'coveslight';    text-transform: uppercase;    margin: 0 0 35px 0;}



#portfolio .postnavigation img {z-index:20; position:relative;top: -10px; }
#portfolio .postnavigation td {position:relative; vertical-align: top;  min-height: 210px; width: auto; display: flex; flex-direction: column; align-items: flex-start;}
#portfolio .postnavigation tr { display: flex; justify-content: space-between;}
#portfolio .postnavigation h2 {max-width:unset; padding:0;margin: 0 auto 45px 0;     letter-spacing: 7px;    font-size: 16px;   width: 100%;  font-family: 'coveslight';  text-transform: uppercase;}
#portfolio .postnavigation img {z-index:20; position:relative; width:200px;}
#portfolio .postnavigation { max-width: 460px; position:relative;  margin: 300px 25px 0 0px; }
#portfolio .prevProject img {left:0;}
#portfolio .nextProject img {right:0;}
#portfolio .prevProject img, #portfolio .nextProject img{ -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s;}
#portfolio .nextProject:before { -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; content: "Next >"; position: absolute; top: -22px; font-size: 9px;  padding: 4px 11px 6px 10px;  -webkit-box-shadow: 0px 0px 3px 1px rgb(222 222 222);  box-shadow: 0px 0px 3px 1px rgb(222 222 222);  border-radius: 8px;  letter-spacing: 4px; right: 12px;  background:#eaebec;  z-index: 10; clip-path: polygon(0% 0%,0% 0%,80% 0%,100% 80%,100% 100%,0% 100%);}
#portfolio .prevProject:before{  -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; content:"< Prev"; position: absolute;  top: -22px;  font-size: 9px; padding: 4px 3px 3px 16px; -webkit-box-shadow: 0px 0px 3px 1px rgb(222 222 222);  box-shadow: 0px 0px 3px 1px rgb(222 222 222);   border-radius: 8px;  letter-spacing: 4px; left: 2px; background: #eaebec;  z-index: 10; clip-path:polygon(20% 0%,0% 0%,0% 0%,100% 0%,100% 100%,0% 100%);}
#portfolio .nextProject, #portfolio .prevProject{margin:12px 12px 0px 0px; }
#portfolio .prevProject:hover img{position:relative; left:-5px; max-width:205px!important;}
#portfolio .nextProject:hover img{position:relative; right:-5px; max-width:205px!important;}
#portfolio .prevProject:hover:before, #portfolio .nextProject:hover:before{opacity:0;}
#portfolio .postnavigation td a {letter-spacing: 7px;    text-transform: uppercase;    font-size: 11px;    text-decoration: none;  line-height: 18px;     padding: 0 0 4px 0;  }
#portfolio .postnavigation td a:last-child {  width: 95%;  display: inline-block;}
#portfolio .postnavigation td:hover a:last-child {  color: #1d1e22; }
#portfolio .projNav {min-height: 430px;   position: relative;   display: flex;   justify-content: end;}
#portfolio #projectNav {  max-width: 440px;}
#portfolio .postnavigation td a:last-child:after {display:none;}
#portfolio .postnavigation td:hover a:last-child:after {border-bottom: 2px solid #5eb4ef;  content: "";  display: block;  width: 13px;  position: absolute; bottom: 0;}
#portfolio .postnavigation td:last-child {  align-items: flex-end;}

/* https://cssgrid-generator.netlify.app/*/
#portfolio .chapter .mag {padding: 0 45px 0 43px; margin: 0 0 200px 0;}
#portfolio .chapter .mag:last-child { margin: 0;}
#portfolio .chapter .mag img {width: 100%; height: auto; object-fit: cover;}
#portfolio .chapter .mag p {max-width:300px;}
#portfolio .chapter .mag h3 {padding: 0 25px 0 0;  letter-spacing: 7px;   line-height: 25px;   font-size: 15px;   font-weight: bold; max-width:300px;   font-family: 'coveslight';    text-transform: uppercase;    margin: 0 0 35px 0;}

#portfolio .chapter .mag .magvar001 {display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr);grid-column-gap: 10px; grid-row-gap: 0.9%; }
#portfolio .chapter .mag .magvar001  .magcell_1 { grid-area: 1 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar001  .magcell_2 { grid-area: 1 / 2 / 3 / 4; }
#portfolio .chapter .mag .magvar001  .magcell_3 { grid-area: 1 / 4 / 2 / 5; }
#portfolio .chapter .mag .magvar001  .magcell_4 { grid-area: 2 / 4 / 3 / 5; } 
#portfolio .chapter .mag .magvar001 p {padding: 0 25px 0 0; margin:0 0 30px 0;}


#portfolio .chapter .mag .magvar002  {display: grid;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(2, 1fr);grid-column-gap: 10px;grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar002 .magcell_1 { grid-area: 1 / 1 / 3 / 3; }
#portfolio .chapter .mag .magvar002 .magcell_2 { grid-area: 1 / 3 / 3 / 4;  display: flex;   align-items: end; }
#portfolio .chapter .mag .magvar002 .magcell_3 { grid-area: 2 / 4 / 3 / 5; }
#portfolio .chapter .mag .magvar002 .magcell_3 img {  position: relative;   bottom: -33%;}
#portfolio .chapter .mag .magvar002 p {padding: 0 25px;}

#portfolio .chapter .mag .magvar003 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .mag .magvar003 .magcell_1 { grid-area: 1 / 1 / 4 / 3; }
#portfolio .chapter .mag .magvar003 .magcell_2 { grid-area: 3 / 3 / 4 / 5; }
#portfolio .chapter .mag .magvar003 .magcell_2 p { columns: 2; column-gap: 75px; max-width:unset;}
#portfolio .chapter .mag .magvar003 .magcell_1 div:first-child { transform: rotate(-45deg) scale(0.8) translate(16%, 50%);}
#portfolio .chapter .mag .magvar003 .magcell_1 div:last-child { transform:rotate(45deg) scale(0.7) translate(-23%, 6%);}

#portfolio .chapter .mag .magvar004  {display: grid;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(1, 1fr);grid-column-gap: 10px;grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar004 .magcell_1 { grid-area: 1 / 1 / 3 / 2;  display: flex;  flex-wrap: wrap;   align-content: end;}
#portfolio .chapter .mag .magvar004 .magcell_2 { grid-area: 1 / 2 / 3 / 2; display: flex;    flex-wrap: wrap;}
#portfolio .chapter .mag .magvar004 .magcell_3 { grid-area: 1 / 3 / 3 / 5; }
#portfolio .chapter .mag .magvar004 .magcell_2 img { flex: 0 0 50%;  width: 144px;  height: auto;  padding: 22px;  object-fit: unset; position: relative; left: -25px;}
#portfolio .chapter .mag .magvar004 p, #portfolio .chapter .mag .magvar004 h3 {padding: 0 25px 0 0;}

#portfolio .chapter .mag .magvar005 {display: grid; grid-template-columns:39.36% auto auto; grid-template-rows: repeat(3, 0fr); grid-column-gap: 10px; grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar005 .magcell_1 { grid-area: 1 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar005 .magcell_2 { grid-area: 1 / 2 / 2 / 3; }
#portfolio .chapter .mag .magvar005 .magcell_3 { grid-area: 2 / 2 / 3 / 3; }
#portfolio .chapter .mag .magvar005 .magcell_4 { grid-area: 3 / 2 / 4 / 4;  display: flex;  justify-content: end;}
#portfolio .chapter .mag .magvar005 .magcell_4 p { columns: 2; column-gap: 75px; max-width:unset; padding: 75px 0 0 20px;}

#portfolio .chapter .mag .magvar006  {display: grid;grid-template-columns: repeat(2, 1fr);grid-template-rows: repeat(2, 1fr);grid-column-gap: 10px;grid-row-gap: 0.9%; padding:0 0 0 15%;}
#portfolio .chapter .mag .magvar006 .magcell_1 { grid-area: 1 / 1 / 2 / 2; }
#portfolio .chapter .mag .magvar006 .magcell_2 { grid-area: 1 / 2 / 2 / 3; }
#portfolio .chapter .mag .magvar006 .magcell_3 { grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar006 .magcell_4 { grid-area: 2 / 2 / 3 / 3; }
#portfolio .chapter .mag .magvar006 .magcell_3 p {padding: 0 25px;}

#portfolio .chapter .mag .magvar007 {display: grid!important; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(3, 1fr); grid-column-gap: 25px; grid-row-gap: 25px;}
#portfolio .chapter .mag .magvar007 .magcell_1 { grid-area: 1 / 1 / 4 / 2; }
#portfolio .chapter .mag .magvar007 .magcell_2 { grid-area: 1 / 2 / 4 / 3; }
#portfolio .chapter .mag .magvar007 .magcell_3 { grid-area: 1 / 3 / 4 / 4; }
#portfolio .chapter .mag .magvar007 .magcell_4 { grid-area: 1 / 4 / 4 / 4; }
#portfolio .chapter .mag .magvar007 > div { display: flex; align-items: center;}

#portfolio .chapter .mag .magvar008  {display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); grid-column-gap: 10px; grid-row-gap: 10px; }
#portfolio .chapter .mag .magvar008 .magcell_1 { grid-area: 1 / 1 / 2 / 3; }
#portfolio .chapter .mag .magvar008 .magcell_2 { grid-area: 2 / 1 / 3 / 3; }
#portfolio .chapter .mag .magvar008 .magcell_3 { grid-area: 1 / 3 / 3 / 4; padding: 0 0 0 25px;}

#portfolio .chapter .mag .magvar009  {display: grid;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(2, 1fr);grid-column-gap: 10px;grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar009 .magcell_1 { grid-area: 1 / 1 / 3 / 3; }
#portfolio .chapter .mag .magvar009 .magcell_2 { grid-area: 1 / 3 / 3 / 4;  display: flex;   align-items: center; }
#portfolio .chapter .mag .magvar009 .magcell_3 { grid-area: 2 / 4 / 3 / 5; }
#portfolio .chapter .mag .magvar009 .magcell_3 img {  position: relative;   bottom: -33%;}
#portfolio .chapter .mag .magvar009 p {padding: 0 25px;}

#portfolio .chapter .mag .magvar010 {display: grid; grid-template-columns:39.36% auto auto; grid-template-rows: repeat(1, 1fr); grid-column-gap: 10px; grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar010 .magcell_1 { grid-area: 1 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar010 .magcell_2 { grid-area: 1 / 3 / 2 / 4; }
#portfolio .chapter .mag .magvar010 .magcell_3 { grid-area: 2 / 1 / 3 / 3; }
#portfolio .chapter .mag .magvar010 .magcell_4 { grid-area: 3 / 2 / 4 / 4;  display: flex;  justify-content: end;}
#portfolio .chapter .mag .magvar010 .magcell_4 p { columns: 2; column-gap: 75px; max-width:unset; padding: 75px 0 0 20px;}
#portfolio .chapter .mag .magvar010 .magcell_1 img {  position: relative;   right: -60%;}

#portfolio .chapter .mag .magvar011 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(4, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .mag .magvar011_1 { grid-area: 1 / 1 / 2 / 2;  display: flex;  align-items: start; }
#portfolio .chapter .mag .magvar011_2 { grid-area: 1 / 2 / 3 / 4;}

#portfolio .chapter .mag .magvar012 {display: grid; grid-template-columns:39.36% auto auto; grid-template-rows: repeat(1, 1fr); grid-column-gap: 10px; grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar012 .magcell_1 { grid-area: 1 / 1 / 3 / 3; }
#portfolio .chapter .mag .magvar012 .magcell_2 { grid-area: 1 / 3 / 2 / 4; }
#portfolio .chapter .mag .magvar012 .magcell_3 { grid-area: 2 / 1 / 3 / 3; }
#portfolio .chapter .mag .magvar012 .magcell_4 { grid-area: 3 / 2 / 4 / 4;  display: flex;  justify-content: end;}
#portfolio .chapter .mag .magvar012 .magcell_4 p { columns: 2; column-gap: 75px; max-width:unset; padding: 75px 0 0 20px;}
#portfolio .chapter .mag .magvar012 .magcell_1 img {  width:85%;}

#portfolio .chapter .mag .magvar013 {display: grid;grid-template-columns: repeat(3, 1fr);grid-template-rows: repeat(2, 1fr); grid-column-gap: 10px; grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar013 .magcell_1{ grid-area: 1 / 1 / 3 / 3; }
#portfolio .chapter .mag .magvar013 .magcell_2{ grid-area: 1 / 3 / 3 / 4; }
#portfolio .chapter .mag .magvar013 .magcell_2 p {padding: 75px 0 0 30px;}

#portfolio .chapter .mag .magvar014  {display: grid;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(1, 1fr);grid-column-gap: 10px;grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar014 .magcell_1 { grid-area: 1 / 1 / 3 / 2;  display: flex;  flex-wrap: wrap;   align-content:center;}
#portfolio .chapter .mag .magvar014 .magcell_2 { grid-area: 1 / 2 / 3 / 2; display: flex; align-items:start;  flex-wrap: wrap;}
#portfolio .chapter .mag .magvar014 .magcell_3 { grid-area: 1 / 3 / 3 / 5; }
#portfolio .chapter .mag .magvar014 .magcell_2 img { flex: 0 0 62%; height: auto;  padding: 0 0 22px 0;  object-fit: unset; width:5%; position: relative; left: -25px;}
#portfolio .chapter .mag .magvar014 p, #portfolio .chapter .mag .magvar004 h3 {padding: 0 25px 0 0;}
.wrap-it-up #portfolio .chapter .mag .magvar014 .magcell_2 img {left: 0;}


#portfolio .chapter .mag .magvar015  {display: grid;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(2, 1fr);grid-column-gap: 10px;grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar015 .magcell_1 { grid-area: 2 / 4 / 3 / 5; }
#portfolio .chapter .mag .magvar015 .magcell_2 { grid-area: 1 / 3 / 3 / 4;  display: flex;   align-items: end; }
#portfolio .chapter .mag .magvar015 .magcell_3 { grid-area: 1 / 1 / 3 / 3; }
#portfolio .chapter .mag .magvar015 .magcell_1 img {  position: relative;   bottom: -33%;}
#portfolio .chapter .mag .magvar015 p {padding: 0 25px;}

#portfolio .chapter .mag .magvar016 {display: grid; grid-template-columns:39.36% auto auto; grid-template-rows: repeat(3, 0fr); grid-column-gap: 10px; grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar016 .magcell_1 { grid-area: 1 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar016 .magcell_2 { grid-area: 1 / 2 / 2 / 3; }
#portfolio .chapter .mag .magvar016 .magcell_3 { grid-area: 2 / 2 / 3 / 3; }
#portfolio .chapter .mag .magvar016 .magcell_4 { grid-area: 3 / 2 / 4 / 4;  display: flex;  justify-content: end;}
#portfolio .chapter .mag .magvar016 .magcell_5 {grid-area: 2 / 3 / 3 / 3; }
#portfolio .chapter .mag .magvar016 .magcell_4 p { columns: 2; column-gap: 75px; max-width:unset; padding: 75px 0 0 20px;}

#portfolio .chapter .mag .magvar018 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(2, 0fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .mag .magvar018 .magcell_1 {grid-area: 1 / 1 / 2 / 4;    display: flex;   align-items: center;   gap: 25px;    flex-wrap: wrap;}
#portfolio .chapter .mag .magvar018 .magcell_1 img {flex: 1 1 15%;}
#portfolio .chapter .mag .magvar018 .magcell_2 p{ max-width:unset; columns: 2; column-gap: 75px; padding: 75px 0 0 0;} 
#portfolio .chapter .mag .magvar018 .magcell_2 { grid-area: 2 / 1 / 3 / 3; }

#portfolio .chapter .mag .magvar019 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(2, 1fr);grid-column-gap: 0px;grid-row-gap: 25px;    max-width:900px; margin-left: auto;}
#portfolio .chapter .mag .magvar019 .magcell_1 { grid-area: 1 / 3 / 3 / 5; position: relative;}
#portfolio .chapter .mag .magvar019 .magcell_1 img:last-child {    position: absolute;    top: 80%;    left: -85px;    width: 228px;}
#portfolio .chapter .mag .magvar019 .magcell_2 {  grid-area: 1 / 1 / 2 / 3;  display: flex;  margin: 0 0 -50% 0;  align-items: center;}
#portfolio .chapter .mag .magvar019 .magcell_3 { grid-area: 1 / 1 / 3 / 5; display: flex;   align-items: end;}
#portfolio .chapter .mag .magvar019 .magcell_4 { grid-area: 1 / 1 / 4 / 5; display: flex;   align-items: end;}
#portfolio .chapter .crop_mro01 {    border-radius: 0 70px 70px 0;}

#portfolio .chapter .mag .magvar020  {display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); grid-column-gap: 10px; grid-row-gap: 50px; }
#portfolio .chapter .mag .magvar020 img {max-width: 792px;}
#portfolio .chapter .mag .magvar020 .magcell_1 { grid-area: 1 / 1 / 2 / 3; }
#portfolio .chapter .mag .magvar020 .magcell_2 { grid-area: 2 / 1 / 3 / 3; }
#portfolio .chapter .mag .magvar020 .magcell_3 { grid-area: 1 / 3 / 2 / 4;  display: flex;  align-items: center; }
#portfolio .chapter .mag .magvar020 .magcell_2 img {  position: relative;  left: 50%;}
#portfolio .chapter .mag .magvar020 p {padding: 0 0 0 45px;}

#portfolio .chapter .mag .magvar021 {display: grid;grid-template-columns: 1fr;grid-template-rows: 1fr;grid-column-gap: 0px;grid-row-gap: 0px;} 
#portfolio .chapter .mag .magvar021 p {    max-width: unset;    padding: 0 0 200px 0;    columns: 2;    column-gap: 75px;}

#portfolio .chapter .mag .magvar022  {display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); grid-column-gap: 10px; grid-row-gap: 50px; }
#portfolio .chapter .mag .magvar022 .magcell_1 { grid-area: 1 / 1 / 3 / 3; }
#portfolio .chapter .mag .magvar022 .magcell_2 { grid-area: 1 / 3 / 3 / 4; }
#portfolio .chapter .mag .magvar022 .magcell_3 { grid-area: 3 / 1 / 4 / 4; display:flex; }
#portfolio .chapter .mag .magvar022 .magcell_3 div  { columns: 3;  gap: 45px;  flex: 0 0 70%;}


#portfolio .chapter .var001 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var001_1 { grid-area: 1 / 1 / 3 / 3; }
#portfolio .chapter .var001_1 img {max-width:630px;}
#portfolio .chapter .var001_2 { grid-area: 2 / 4 / 3 / 5; display: flex;   align-items: end;}
#portfolio .chapter .var001 p {max-width:350px; padding:0 25px 0 0;}

#portfolio .chapter .var002  {display: grid!important; grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var002_1{ grid-area: 1 / 1 / 4 / 3; }
#portfolio .chapter .var002_1 img { max-width: 470px;}
#portfolio .chapter .var002_2 { grid-area: 1 / 3 / 3 / 4;    align-items: center;   display: flex;}
#portfolio .chapter .var002_3 { grid-area: 2 / 4 / 4 / 5; }
#portfolio .chapter .var002_4 { grid-area: 4 / 2 / 3 / 2; transform: translate(20%, 0px);}
#portfolio .chapter .var002 p {max-width:350px; padding:0 25px; transform: translate(-25%, 0px);}

#portfolio .chapter .var003 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var003_1 { grid-area: 1 / 1 / 4 / 3; }
#portfolio .chapter .var003_2 { grid-area: 3 / 3 / 4 / 5; }
#portfolio .chapter .var003_2 p { columns: 2; margin: -20% 0 0 0; column-gap: 75px;}
#portfolio .chapter .var003_1 div:first-child { transform: rotate(-45deg) scale(0.8) translate(16%, 50%);}
#portfolio .chapter .var003_1 div:last-child { transform:rotate(45deg) scale(0.7) translate(-23%, 6%);}

#portfolio .chapter .var004 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var004_1 { grid-area: 1 / 1 / 3 / 2; }
#portfolio .chapter .var004_1 p {max-width:350px; padding:0 25px 0 0;}
#portfolio .chapter .var004_2 { grid-area: 1 / 2 / 3 / 4; }
#portfolio .chapter .var004_3 { grid-area: 1 / 4 / 3 / 5;      align-content: flex-start;   display: flex;  flex-wrap: wrap;  justify-content: end;}
#portfolio .chapter .var004_3 img {  max-width: 165px;   margin: 0 0 45px 0;}
#portfolio .chapter .var004_2 img { transform: translate(8%, 0px);}

#portfolio .chapter .var005 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var005 img {  max-width: 165px;   margin: 0 0 45px 0;}
#portfolio .chapter .var005_1 { grid-area: 1 / 1 / 2 / 2; }
#portfolio .chapter .var005_2 { grid-area: 1 / 2 / 2 / 3; }
#portfolio .chapter .var005_3 { grid-area: 1 / 3 / 2 / 4; }
#portfolio .chapter .var005_4 { grid-area: 1 / 4 / 2 / 5; }

#portfolio .chapter .var006 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(4, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var006_1 { grid-area: 1 / 1 / 4 / 3; }
#portfolio .chapter .var006_2 { grid-area: 1 / 3 / 4 / 5; }
#portfolio .chapter .var006_2 img { max-width: 360px;  margin: 25px 0; transform: translate(50%, 0px);}
#portfolio .chapter .var006_2 p { max-width: 350px;}

#portfolio .chapter .var007 {display: grid!important; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(4, 1fr); grid-column-gap: 25px; grid-row-gap: 25px;}
#portfolio .chapter .var007_1 { grid-area: 1 / 1 / 4 / 2; }
#portfolio .chapter .var007_2 { grid-area: 1 / 2 / 4 / 3; }
#portfolio .chapter .var007_3 { grid-area: 1 / 3 / 4 / 4; }
#portfolio .chapter .var007_4 { grid-area: 1 / 4 / 4 / 4; }
#portfolio .chapter .var007 > div { display: flex; align-items: center;}
#portfolio .chapter .var007 p { transform: translate(20%, 0px);}

#portfolio .chapter .var008 {display: grid!important;grid-template-columns: repeat(3, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var008_1 { grid-area: 1 / 1 / 2 / 2; }
#portfolio .chapter .var008_2 { grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .var008_3 { grid-area: 1 / 2 / 3 / 3; }
#portfolio .chapter .var008_4 { grid-area: 2 / 3 / 3 / 4; }
#portfolio .chapter .var008_1 img, #portfolio .chapter .var008_2 img {  max-width: 272px;}
#portfolio .chapter .var008_3 img {transform: translate(-30%, 0px);}

#portfolio .chapter .var009 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(2, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var009_1 { grid-area: 1 / 1 / 3 / 4; }
#portfolio .chapter .var009_2 { grid-area: 1 / 4 / 3 / 4; display: flex; align-items: end;}

#portfolio .chapter .var010 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(4, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var010_1 { grid-area: 1 / 1 / 3 / 2; }
#portfolio .chapter .var010_2 { grid-area: 1 / 2 / 3 / 5; display: flex;  align-items: end;}

#portfolio .chapter .var011 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(4, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var011_1 { grid-area: 1 / 1 / 2 / 2;  display: flex;  align-items: start; }
#portfolio .chapter .var011_2 { grid-area: 1 / 2 / 3 / 4;}

#portfolio .chapter .var012 {display: grid!important;grid-template-columns: repeat(3, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var012_1 { grid-area: 1 / 1 / 2 / 2; }
#portfolio .chapter .var012_2 { grid-area: 1 / 2 / 2 / 3; }
#portfolio .chapter .var012_3 { grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .var012_4 { grid-area: 2 / 2 / 3 / 3; } 

#portfolio .chapter .var013 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(4, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var013_1 { grid-area: 1 / 1 / 3 / 2; }
#portfolio .chapter .var013_2 { grid-area: 1 / 2 / 3 / 3; }
#portfolio .chapter .var013_3 { grid-area: 1 / 3 / 3 / 4; }
#portfolio .chapter .var013_4 { grid-area: 3 / 1 / 4 / 2; }

#portfolio .chapter .var014 {display: grid!important; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(4, 1fr); grid-column-gap: 25px; grid-row-gap: 25px;}
#portfolio .chapter .var014_1 { grid-area: 1 / 2 / 3 / 5; }
#portfolio .chapter .var014_2 { grid-area: 3 / 2 / 4 / 3; }
#portfolio .chapter .var014_3 { grid-area: 1 / 1 / 4 / 2; }

#portfolio .chapter .var015 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var015_1 { grid-area: 1 / 1 / 4 / 4; }
#portfolio .chapter .var015_2 { grid-area: 1 / 5 / 2 / 4; display: flex;   align-items: end;}
#portfolio .chapter .var015_3 { grid-area: 1 / 1 / 3 / 5; display: flex;   align-items: end;}
#portfolio .chapter .var015 p {max-width:50%; padding:0 25px 0 0;}

#portfolio .chapter .var016 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var016_1 { grid-area: 1 / 3 / 3 / 5; position: relative;}
#portfolio .chapter .var016_1 img:last-child {    position: absolute;    top: 80%;    left: -85px;    width: 228px;}
#portfolio .chapter .var016_2 {  grid-area: 1 / 1 / 2 / 3;  display: flex;  margin: 0 0 -50% 0;  align-items: center;}
#portfolio .chapter .var016_3 { grid-area: 1 / 1 / 3 / 5; display: flex;   align-items: end;}
#portfolio .chapter .var016_4 { grid-area: 1 / 1 / 4 / 5; display: flex;   align-items: end;}
#portfolio .chapter .crop_mro01 {    border-radius: 0 70px 70px 0;}


#portfolio .chapter .var017 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var017_2 { grid-area: 3 / 3 / 4 / 5; }
#portfolio .chapter .var017_1 img { max-width: 180px;}
#portfolio .chapter .var017_1 {grid-area: 1 / 1 / 3 / 2; display: flex; flex-direction: column;  justify-content: space-around;  align-items: center;}
#portfolio .chapter .var017_3 {grid-area: 3 / 2 / 1 / 5;}
#portfolio .chapter .var017_3 img { margin: 0 0 0 8%;  max-width: 770px;}

#portfolio .chapter .var018 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var018_1 {grid-area: 1 / 1 / 2 / 4;    display: flex;   align-items: center;   gap: 25px;    flex-wrap: wrap;}
#portfolio .chapter .var018_1 img {flex: 1 1 15%;}
#portfolio .chapter .var018_2 p	{columns: 2; column-gap: 75px;}
#portfolio .chapter .var018_2 { grid-area: 2 / 1 / 3 / 3; }

#portfolio .chapter .var019 {display: grid!important; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(4, 1fr); grid-column-gap: 25px; grid-row-gap: 25px;}
#portfolio .chapter .var019_1 { grid-area: 1 / 1 / 3 / 4; }
#portfolio .chapter .var019_2 { grid-area: 3 / 2 / 4 / 3; }
#portfolio .chapter .var019_3 { grid-area: 1 / 4 / 4 / 5; }
#portfolio .chapter .var019_3 p{ margin: 24% -138px 0 138px;}

#portfolio .chapter .var020 {display: grid!important;grid-template-columns: repeat(6, 1fr);grid-template-rows: repeat(4, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var020_1 { grid-area: 1 / 1 / 2 / 3; }
#portfolio .chapter .var020_2 { grid-area: 1 / 3 / 4 / 5; }
#portfolio .chapter .var020_3 { grid-area: 1 / 5 / 6 / 7; }

#portfolio .chapter .var021 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(4, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var021_1 {  grid-area: 1 / 1 / 2 / 2;  display: flex;   align-items: end;}
#portfolio .chapter .var021_2 { grid-area: 1 / 2 / 2 / 4; }
#portfolio .chapter .var021_2 img {transform: translate(15%, 0px);}
#portfolio .chapter .var021_3 { grid-area: 2 / 1 / 2 / 3; }
#portfolio .chapter .var021_4 { grid-area: 2 / 3 / 4 / 5; }


#portfolio .chapter .var022 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(4, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var022_1 { grid-area: 1 / 1 / 4 / 3; }
#portfolio .chapter .var022_2 { grid-area: 1 / 3 / 4 / 5; }
#portfolio .chapter .var022_2 img { max-width: 360px;  margin: 25px 0; transform: translate(50%, 0px);}
#portfolio .chapter .var022_2 p { max-width: 350px;     margin: 10%;}


#portfolio .chapter .var023 {display: grid!important;grid-template-columns: repeat(3, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var023_1 { grid-area: 1 / 2 / 4 / 4; }
#portfolio .chapter .var023_2 { grid-area:  1 / 1 / 4 / 2; }
#portfolio .chapter .var023_2 img {  max-width: 64%;  margin: 0 0 25px 15%;}

#portfolio .chapter .var024 {display: grid!important;grid-template-columns: repeat(3, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .var024_1 { grid-area: 1 / 3 / 4 / 4; }
#portfolio .chapter .var024_2 { grid-area:  1 / 1 / 4 / 2; }
#portfolio .chapter .var024_2 img {  max-width: 64%;  margin: 0 0 25px 15%;}
#portfolio .chapter .var024_3 { display: flex; flex-wrap: wrap; align-content: center;  grid-area: 1 / 2 / 4 / 2;}
#portfolio .chapter .var004_1 p, #portfolio .chapter .var004_1 h3 {  max-width: 350px;    padding: 0 25px 0 0;}


/*#portfolio .chapter .imageQuote {display:flex; align-items: center; padding:0 0 0 45px; position: relative;  left: -260px;  z-index: 500; }*/
#portfolio .chapter .imageQuote {display:flex; align-items: center; padding:0 0 0 0px; position: relative;  left: -265px;  z-index: 500; }
#portfolio .chapter .imageQuote > div {width:50%;}
#portfolio .chapter .imageQuote .shortTestimonial p {font-size:26px; line-height:32px; text-align:left; display:flex; flex-wrap:wrap; width:100%;}
#portfolio .chapter .imageQuote .shortTestimonial {max-width: 405px; margin: 0 auto; position: relative; padding: 0 0 0 60px;}
#portfolio .chapter .imageQuote .shortTestimonial span {clear:both;  display: block; position:relative;}
#portfolio .chapter .imageQuote .shortTestimonial > span { margin:50px 0 0 0;}
#portfolio .chapter .imageQuote .shortTestimonial > span:before {content:url("/images/quote.svg");  position:absolute; top: -45px;left: -57px; transform:scale(0.3);}
#portfolio .chapter .imageQuote .shortTestimonial span span {line-height: 27px; padding-top: 27px; letter-spacing: 7px; text-transform: uppercase;font-size: 12px;}
#portfolio .chapter .imageQuote .longTestimonial 	{    max-width: 405px;   margin: 0 auto;    position: relative;    padding: 0 60px;}
#portfolio .chapter .imageQuote .longTestimonial p{letter-spacing: 2px;    line-height: 26px; text-align:left; display:flex; flex-wrap:wrap; width:100%;    font-size: 17px;}
#portfolio .chapter .imageQuote .longTestimonial span {clear:both;  display: block; position:relative;}
#portfolio .chapter .imageQuote .longTestimonial > span { margin:50px 0 0 0;}
#portfolio .chapter .imageQuote .longTestimonial > span:before {content:url("/images/quote.svg");  position:absolute; top: -45px;left: -57px; transform:scale(0.3);}
#portfolio .chapter .imageQuote .longTestimonial span span {line-height: 27px; padding-top: 27px; letter-spacing: 7px; text-transform: uppercase;font-size: 12px;}
#portfolio .chapter.noTestimonial {background:#e8e8e9; width: 100%;}
#portfolio .chapter.noTestimonial .imageQuote{  width: calc(100% + 260px); padding: 0; background: #e8e8e9;}
#portfolio .chapter.noTestimonial .imageQuote .noTestimonial h3 {padding: 0 25px 0 0;  letter-spacing: 7px;  line-height: 25px;   font-size: 15px;   font-weight: bold;   max-width: 300px;  font-family: 'coveslight';  text-transform: uppercase;  margin: 0 0 35px 0;}
#portfolio .chapter.noTestimonial .imageQuote .noTestimonial p {letter-spacing: 2px; max-width: 75%; line-height: 23px;  font-size: 14px; text-align:left; display:flex; flex-wrap:wrap; width:100%;}
#portfolio .chapter.noTestimonial .imageQuote .noTestimonial p.noflex {display:inline-block;padding: 0 0 20px 0;}
#portfolio .chapter.noTestimonial .imageQuote .noTestimonial {width:100%; margin: 0 auto; position: relative; padding: 0 60px;}
#portfolio .chapter.noTestimonial .imageQuote > div:first-child img {width:100%; display: block;}
#portfolio .chapter .imageQuote > div:first-child img {width:100%; display: block;}
#portfolio .chapter.noTestimonial .imageQuote > div:first-child img {width:100%; display: block; max-width: 725px;}
#portfolio .chapter.noTestimonial.alt {width:80%;}
#portfolio .chapter.noTestimonial.alt .imageQuote {margin:5px 0; width:78vw; left:0;}
#portfolio .chapter.noTestimonial.alt .imageQuote:first-child, #portfolio .chapter.noTestimonial.alt .imageQuote:last-child {margin: 0;}
#portfolio .chapter.noTestimonial .imageQuote > div:first-child {    background: transparent!important;}
/*portfolio .chapter.noTestimonial .imageQuote.alt {left: -232px; flex-direction: row-reverse;}*/


#portfolio .rollerImages{display: flex;  padding: 50px; position: -webkit-sticky; position: sticky; top: 20px; align-items: center; justify-content: center;transform: translate(0px, -40px);}
#portfolio .rollerImages ul li {position:relative; top:0; -webkit-transition: all  0.6s cubic-bezier(0, 0.55, 0.45, 1); -moz-transition: all  0.6s cubic-bezier(0, 0.55, 0.45, 1); -o-transition:all  0.6s cubic-bezier(0, 0.55, 0.45, 1); transition: all  0.6s cubic-bezier(0, 0.55, 0.45, 1);  }
#portfolio .row.roller {display: flex;}
#portfolio .rollerImages.phone > div, #portfolio .rollerImages.desktop > div, #portfolio .devicePair .col.staticPhone div:first-child, #portfolio .devicePair .col.staticDesktop div:first-child {display: flex;  position: relative; z-index: 500; text-align:center; padding:17px 0px 35px 0; }
#portfolio .rollerImages.phone > div:before	{content:"";background-image: linear-gradient(-45deg, #dedede 5%, #f2f2f2 5%, #f2f2f2 45%, #dedede 45%, #dedede 55%, #f2f2f2 55%, #f2f2f2 95%);  background-size: 12px 12px;    clip-path: polygon(0 0, 100% 0, 100% 25%, 0% 100%); height: 50%; width: 110%;  position: absolute;  left: -15px;    top: 0px;}
#portfolio .rollerInvert .rollerImages.phone > div:before{display:none;}
#portfolio .rollerInvert .rollerImages.phone > div:after	{content:"";background-image: linear-gradient(-45deg, #dedede 5%, #f2f2f2 5%, #f2f2f2 45%, #dedede 45%, #dedede 55%, #f2f2f2 55%, #f2f2f2 95%);  background-size: 12px 12px;    clip-path: polygon(0 85%, 100% 0, 100% 100%, 0% 100%); height: 50%; width: 110%;  position: absolute;  left: -15px;  bottom: 15px;}

#portfolio .chapter .slideOut {flex: 1; padding: 0 0 0 45px; height: 100vh;   align-items: start; max-width: 95%;    justify-content: space-between;    display: flex;    background: transparent;}

#portfolio .devicePair {display:flex;}
#portfolio .devicePair .row.roller > div { width: 50%;}
#portfolio .devicePair .col.staticDesktop div:first-child { padding:17px 0 15px 0;}
#portfolio .devicePair .text:first-child { position: absolute;}
#portfolio .rollerImages.phone ul { overflow:hidden; height:766.391px;  z-index: 15;}
#portfolio .rollerImages.phone img{ height:766.391px; padding:10px !important;}
#portfolio .rollerImages.desktop ul { overflow:hidden; height:80vh;}
#portfolio .rollerImages.desktop img{ height:80vh; padding:10px !important;}
#portfolio .rollerImages.desktop-solo { margin: 0 4% 0 0;}
#portfolio .row.roller.overlap{position:relative;} 
#portfolio .row.roller.overlap .phone > div { background: #ffffff;}
#portfolio .row.roller.overlap .phone img { height:60vh; }
#portfolio .row.roller.overlap .phone {margin: 0px -180px 0 0px; z-index: 300;  padding: 0px 140px 50px 50px;}
#portfolio .row.roller.overlap .phone ul {overflow: hidden; height: 60vh;}
#portfolio .row.roller .rollerText { display: flex;  flex-direction: column; margin-bottom: 200px;}
#portfolio .row.roller .rollerText.imgShrink .waypoint {display: flex;  flex-wrap: nowrap;  max-width:unset;}
#portfolio .row.roller .rollerText.imgShrink .waypoint img {width: 50%;  max-width: 300px; order:2;}
#portfolio .row.roller .rollerImages.mainimgShrink img {max-width:745px; height:auto;}
#portfolio .row.roller .rollerImages.mainimgShrink ul {height:63vh;}
#portfolio .row.roller .rollerText.imgShrink .waypoint p {max-width:300px;  order:1; margin:140px 50px 0 0px;}
#portfolio .row.roller .rollerText .waypoint { padding: 0 50px 0 0;  display: flex;  align-items: center;  margin: 420px 0;   max-width: 380px; }
#portfolio .row.roller .rollerText .waypoint p img { padding: 0!important;  max-width: 100%;  margin:70px 0 30px 0px;}
#portfolio .row.roller .rollerText .waypoint p {padding:0 0 0 60px;}
#portfolio .row.rollerInvert > div:first-child {order:2;}
#portfolio .row.rollerInvert > div:last-child {order:1;}
#portfolio .row .rollerImages { padding:50px 0px 50px 50px;}
#portfolio .row.rollerInvert .rollerImages { transform: translate(38px, 40px); padding:0 50px;}
#portfolio .row .rollerImages.desktop {  padding: 70px;}
#portfolio .row .rollerImages.desktop > div:before	{content:"";background-image: linear-gradient(-45deg, #dedede 5%, #f2f2f2 5%, #f2f2f2 45%, #dedede 45%, #dedede 55%, #f2f2f2 55%, #f2f2f2 95%);  background-size: 12px 12px;    clip-path: polygon(100% 0, 100% 39%, 25% 100%, 0 100%, 0% 0); height: 100%; width: 105%;  position: absolute;  left: -15px;    top: 0px;}

#portfolio .row .focus {display:flex;  flex-wrap: nowrap; align-content:center;   position: relative;  left: -260px;}
#portfolio .row .focus h3 { letter-spacing: 7px;  font-size: 16px;  font-weight: bold;  width: 100%;  font-family: 'coveslight';  text-transform: uppercase;  margin: 0 0 35px 0;}
#portfolio .row .focus > div:first-child { padding: 25px;   background: #e8e8e9;  flex: 1;  align-content: center;  display: flex;   flex-wrap: wrap;  justify-content: center;}
#portfolio .row .focus h3, #portfolio .row .focus p {max-width:440px;}
#portfolio .chapter .imageQuote > div:first-child { min-width: 730px; text-align: right;}
#portfolio .devicePhone.special .roller > div {  min-width: 50%;}
#portfolio .rollerImages.special {transform: translate(0px, 0px);}
#portfolio .textOnly2Col div {  columns:2; gap:45px; flex: 0 0 50%;}

.halo-coffee #portfolio .chapter .imageQuote > div:first-child{background:#e8e8e9;}
.wrap-it-up #portfolio .chapter .var024_1 img {margin:0 0 0 50px;}
.dennis-publishing-marketing-design #portfolio .chapter .imageQuote > div:first-child{background:#eef2f5;}

#portfolio .row .rollerImages.special{  padding: 70px;height: 80vh;}
#portfolio .row .rollerImages.special > div:before	{content:"";background-image: linear-gradient(-45deg, #dedede 5%, #f2f2f2 5%, #f2f2f2 45%, #dedede 45%, #dedede 55%, #f2f2f2 55%, #f2f2f2 95%);  background-size: 12px 12px;    clip-path: polygon(100% 0, 100% 39%, 25% 100%, 0 100%, 0% 0); height: 100%; width: calc(100% + 40px);  position: absolute; left: -20px;  top: -20px;}

.fragrances-of-the-world .specialWrapper .card {background:#ffffff; position:absolute; top:0; left:0; width:100%; height: 75vh; text-align:center; padding: 50px 0 0 0;}
.fragrances-of-the-world .specialWrapper #card2 , .fragrances-of-the-world .specialWrapper #card3{opacity:0;}
.fragrances-of-the-world .specialWrapper .footerrow {position:absolute; bottom:0; width:100%; text-align:center; padding:25px;}
.fragrances-of-the-world .specialWrapper .footerrow img {display:inline;max-height: 37px;}
.fragrances-of-the-world .specialWrapper ::-webkit-input-placeholder { font-size: 15px;}
.fragrances-of-the-world .specialWrapper ::-moz-placeholder { font-size: 15px;}
.fragrances-of-the-world .specialWrapper :-ms-input-placeholder {font-size: 15px;}
.fragrances-of-the-world .specialWrapper :-moz-placeholder {font-size: 15px;}
.fragrances-of-the-world .specialWrapper small {font-size:10px; display:block; text-align:center; padding:10px 0;}
.fragrances-of-the-world .specialWrapper .cardsWrapper {background:#fff;}

#portfolio .row .rollerImages.special .status-bar {  background-color: #f4f4f4;  display: flex;  font-family: 'helvetica neue', helvetica, sans-serif;  font-size: 10pt;  padding: .0.5em .9em; position: absolute;  top: 0;  z-index: 200;  width: 100%;  left: 0;
  justify-content: space-between;  align-items: center;}
  #portfolio .row .rollerImages.special .status-bar  span {  line-height: 35px;  height: 33px;}

/* TEMP*/
.fragrances-of-the-world .specialWrapper.temp{ background:#af1b1b;}
.fragrances-of-the-world .specialWrapper  img {display:inline;}
.fragrances-of-the-world .specialWrapper  p {color:#ffffff; padding:15px;}
.fragrances-of-the-world .specialWrapper  span {color:#ffffff; font-weight:bold; font-size:25px; line-height:50px;}
.fragrances-of-the-world .card * {font-family: 'AvenirLTStd-Light', Helvetica, Arial, sans-serif!important; font-weight: normal !important;}


/*CARD 0*/ 
.fragrances-of-the-world .specialWrapper #card0 .searchInner:first-child{margin:0 0 7px;}
.fragrances-of-the-world .specialWrapper #card0 .buttonrow { padding: 20px;}
.fragrances-of-the-world .specialWrapper #card0 .buttonrow:first-child { padding:0 20px;}
.fragrances-of-the-world .specialWrapper #card0 .buttonrow span {cursor:pointer;}
.fragrances-of-the-world .specialWrapper #card0 .error .dismiss {background: url(cancel2.png) no-repeat right -4px;  background-size: 28px;  cursor: pointer; float: right; display: inline-block; width: 30px; height: 31px;  margin: -31px 0px 0 0px;}
.fragrances-of-the-world .specialWrapper #card0 .error {background:#000; padding:15px; position: fixed; top:-80px; z-index:200; width:100%;  -webkit-transition: all 0.7s ease-in-out; -moz-transition: all 0.7s ease-in-out; -o-transition: all 0.7s ease-in-out; transition: all 0.7s ease-in-out;}
.fragrances-of-the-world .specialWrapper #card0 .error p {color:#ffffff; font-size: calc(11px + 0.5vw); width:80%; text-align:left; line-height: calc(15px + 0.5vw);}
.fragrances-of-the-world .specialWrapper #card0 .error.active {top:0;}
.fragrances-of-the-world .specialWrapper #card0 p.intro { font-size: calc(11px + 0.5vw); line-height: calc(15px + 0.5vw);text-transform:none; padding:15px 15px 0 15px;}
.fragrances-of-the-world .specialWrapper #card0 h1 { font-size:calc(34px + 0.5vw); text-transform:uppercase; margin: 20px 0 0 0;}

/*CARD 1*/
.fragrances-of-the-world .specialWrapper #card1 .content { position: relative;}
.fragrances-of-the-world .specialWrapper #card1.loading .logo, .fragrances-of-the-world .specialWrapper #card1.loading .content, .fragrances-of-the-world .specialWrapper #card0.loading .logo, .fragrances-of-the-world .specialWrapper #card0.loading .content { opacity: 0; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out;}
.fragrances-of-the-world .specialWrapper #card1 .logo, .fragrances-of-the-world .specialWrapper #card0 .logo {padding:20px; display:block; width:100%; opacity: 1; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out;}
.fragrances-of-the-world .specialWrapper #card1 .content, .fragrances-of-the-world .specialWrapper #card0 .content {opacity: 1; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out;}
.fragrances-of-the-world .specialWrapper #card1 .logo img, .fragrances-of-the-world .specialWrapper #card0 .logo img {    max-width: 300px;   display: inline-block;   width: calc(100% + 0.5vw);}
.fragrances-of-the-world .specialWrapper #card1 h1 { font-size:calc(34px + 0.5vw); text-transform:uppercase; margin: 0;}
.fragrances-of-the-world .specialWrapper #card1 h1 span, .fragrances-of-the-world .specialWrapper #card0 h1 span { font-size:calc(17px + 0.5vw); color: #000;}
.fragrances-of-the-world .specialWrapper #card1 .buttonrow {padding:40px;}
.fragrances-of-the-world .specialWrapper #card1 .buttonrow  .button, .fragrances-of-the-world .specialWrapper #card0 .buttonrow  .loginbutton{text-transform:uppercase; border:1px solid #000000; padding: 14px 21px; display:inline-block; font-size:calc(13px + 0.5vw); -o-transition: .4s; -ms-transition: .4s; -moz-transition: .4s; -webkit-transition: .4s; transition: .4s; cursor:pointer; background:#ffffff; color: #000; height: unset;}
.fragrances-of-the-world .specialWrapper #card1 .buttonrow  .button:active, .fragrances-of-the-world .specialWrapper #card1 .buttonrow  .button:hover, .fragrances-of-the-world .specialWrapper #card0 .buttonrow  .loginbutton:active, .fragrances-of-the-world .specialWrapper #card0 .buttonrow  .loginbutton:hover {cursor:pointer;background:#f9fafa; box-shadow:unset;}
.fragrances-of-the-world .specialWrapper #card1 .buttonrow  .button:before, .fragrances-of-the-world .specialWrapper #card0 .buttonrow  .loginbutton:before, .fragrances-of-the-world .specialWrapper #card1 .buttonrow  .button:after, .fragrances-of-the-world .specialWrapper #card0 .buttonrow  .loginbutton:after {display:none;}

/*CARD 2*/
.fragrances-of-the-world .specialWrapper #card2 h1 { font-size:calc(31px + 0.5vw); text-transform:uppercase; margin: 20px 0 0 0;}
.fragrances-of-the-world .specialWrapper #card2 .searchrow, .fragrances-of-the-world .specialWrapper #card0 .searchrow {padding:30px;  max-width: 600px;   margin: 0 auto;}
.fragrances-of-the-world .specialWrapper #card2 .searchInner, .fragrances-of-the-world .specialWrapper #card0 .searchInner{text-transform:uppercase; border:1px solid #000000; padding:7px 0px 7px 15px; display:inline-block;  font-family: 'avenir_lt_55_romanbold', Helvetica, Arial, sans-serif; -o-transition: .4s; -ms-transition: .4s; -moz-transition: .4s; -webkit-transition: .4s; transition: .4s; background:#ffffff; width:100%; text-align:left;}
.fragrances-of-the-world .specialWrapper #card2 .searchInner input, .fragrances-of-the-world .specialWrapper #card0 .searchInner input {width:90%; text-align:left; font-size: 15px; height: 35px;}
.fragrances-of-the-world .specialWrapper #card2 .searchInner span {background: url(search.png) no-repeat right 5px center;background-size: 23px; float:right; display:inline-block; width:30px; height:31px; margin: 0 0 0 2px;}
.fragrances-of-the-world .specialWrapper #card2 .searchInner span.cancel {background: url(cancel.png) no-repeat right 5px center;background-size: 23px; cursor:pointer;}
.fragrances-of-the-world .specialWrapper #card2  a {display:block; text-align:left; text-decoration:none; margin:2px 0;}
.fragrances-of-the-world .specialWrapper #card2 .search-results { padding: 0 30px;   max-width: 600px;   margin: 0 auto;}
.fragrances-of-the-world .specialWrapper #card2 .search-results a { padding: 0 0 8px 0;}

/* CARD 3 */
.fragrances-of-the-world .specialWrapper #card3 h1 { font-size:calc(31px + 0.5vw); text-transform:uppercase; margin: 20px 0 0 0;}
.fragrances-of-the-world .specialWrapper #card3 #wheelHolder {z-index:200;margin:0;position: absolute; text-align:center; bottom: 0;  -webkit-transition: all 7s ease-in-out; -moz-transition: all 7s ease-in-out; -o-transition: all 7s ease-in-out; transition: all 1s ease-in-out; width: 100%; margin: 0; bottom: -990px; left: 50%;  transform: translateX(-50%);}
.fragrances-of-the-world .specialWrapper #card3 #wheelHolder.loading {width: 100%;  left: 50%;  bottom: calc(50% - 50vh);  transform: translateX(-50%);}
.fragrances-of-the-world .specialWrapper #card3 #wheel {max-width:600px;width: 100%; -webkit-animation: stop 0s infinite linear;  transform: rotate(0deg);   -webkit-transition: all 0.7s ease-in-out; -moz-transition: all 0.7s ease-in-out; -o-transition: all 0.7s ease-in-out; transition: all 0.7s ease-in-out;}
.fragrances-of-the-world .specialWrapper #card3 .searching {	line-height: 22px;	font-size: calc(7px + 0.5vw);	position: absolute;	width: 200px;	top: 135px;	margin: 0 0 0 -100px;	left: 50%;}
.fragrances-of-the-world .specialWrapper #card3 #wheelHolder #wheel .segment {opacity:0.3; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out;}
.fragrances-of-the-world .specialWrapper #card3 #wheelHolder.loading #wheel .segment {opacity:0; -webkit-transition: all 2s ease-in-out; -moz-transition: all 2s ease-in-out; -o-transition: all 2s ease-in-out; transition: all 2s ease-in-out;}
.fragrances-of-the-world .specialWrapper #card3 #wheelHolder.loading #wheel  {-webkit-animation: rotation 1s infinite linear; margin: 0 auto; width: 60%; max-width:320px;}
.fragrances-of-the-world .specialWrapper #card3 #row {margin: 25px 5px; position: relative; z-index:300; opacity:0;  -webkit-transition: all 3s ease-in-out; -moz-transition: all 3s ease-in-out; -o-transition: all 3s ease-in-out; transition: all 3s ease-in-out;}
.fragrances-of-the-world .specialWrapper #card3 { overflow: hidden;}
.fragrances-of-the-world .specialWrapper #card3 #row.loaded {opacity:1;}
.fragrances-of-the-world .specialWrapper #card3 .result{overflow:hidden; width: 33.333333%; float: left; display: block; cursor:pointer; position: absolute; padding: 12px 15px 24px 15px;  -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out;}
.fragrances-of-the-world .specialWrapper #card3 .result.rank0 {left:0;}
.fragrances-of-the-world .specialWrapper #card3 .result.rank1 {left:33.333333%; margin:0 0 0 0;}
.fragrances-of-the-world .specialWrapper #card3 .result.rank2 {right:0;}
.fragrances-of-the-world .specialWrapper #card3 .result.rank1.active{margin:0 -5.3333335%}
.fragrances-of-the-world .specialWrapper #card3 .result.active {z-index:10; border:1px solid #000000; width: 44%; background:#ffffff; overflow:visible;}
.fragrances-of-the-world .specialWrapper #card3 .result .resultTitle{ font-size: calc(14px + 0.5vw); margin:15px 0 0 0; display:block; width:100%; opacity: 0.2;}
.fragrances-of-the-world .specialWrapper #card3 .result .resultnotes{ font-size: calc(11px + 0.5vw); margin:15px 0 0 0; display:block; width:100%; opacity: 0.2; line-height: calc(14px + 0.5vw);}
.fragrances-of-the-world .specialWrapper #card3 .result .resultImage{ width:100%; min-height:20vh; height:20vh; background-size: contain!important;}
.fragrances-of-the-world .specialWrapper #card3 .result.active span {display:block; width:100%;height:10px; position: absolute; bottom:-1px; left:0;}
.fragrances-of-the-world .specialWrapper #card3 #wheelHolder #wheel .segment.active, .fragrances-of-the-world .specialWrapper #card3 .result.active .resultTitle, #card3 .result.active .resultnotes {opacity:1!important;}
.fragrances-of-the-world .specialWrapper #card3 #familyName_1, .fragrances-of-the-world .specialWrapper #card3 #familyName_2, .fragrances-of-the-world .specialWrapper #card3 #familyName_3 {cursor:pointer;font-size: 16px;display: inline-block;margin: 0 0 0 -60px;width:120px;text-transform: uppercase;position: absolute;text-align: center;top: 0px;color: #ffffff; padding:24px 0; text-shadow: 1px 1px 17px #000000; left: 50%; -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out; -o-transition: all 1s ease-out; transition: all 1s ease-out; opacity:1;}
.fragrances-of-the-world .specialWrapper #card3 #familyName_1.loading, .fragrances-of-the-world .specialWrapper #card3 .sa.loading, .fragrances-of-the-world .specialWrapper #card3 h1.loading, .fragrances-of-the-world .specialWrapper #card3 #familyName_2, .fragrances-of-the-world .specialWrapper #card3 #familyName_3 {opacity:0;}
.fragrances-of-the-world .specialWrapper #card3 .familyName {z-index:0;}
.fragrances-of-the-world .specialWrapper #card3 .familyName.active {z-index:100; opacity:1!important;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_03 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_03  { background:#EC028C;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_10 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_10  { background:#72C167;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_09 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_09  { background:#FFDE00;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_00 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_00  { background:#009AC7;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_07 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_07  { background:#34715A;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_11 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_11   { background:#514E86;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_08 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_08  { background:#8A845C;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_04 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_04  { background:#C92D92;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_05 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_05  { background:#98022E;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_06 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_06  { background:#BA5A15;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_12 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_12  { background:#BB813B;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_13 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_13   { background:#F57B21;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_02 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_02 { background:#F172AC;}
.fragrances-of-the-world .specialWrapper #card3 .result.family_01 span, .fragrances-of-the-world .specialWrapper #card3 .modal.family_01 { background:#EE4136;}
.fragrances-of-the-world .specialWrapper #card3 .content { position: relative;}



.fragrances-of-the-world .specialWrapper #card3 .modal, .fragrances-of-the-world .specialWrapper #card3 #modalMask {opacity:1; -webkit-transition: opacity .5s ease-out; -moz-transition: opacity .5s ease-out; -o-transition: opacity .5s ease-out; transition: opacity .5s ease-out;}
.fragrances-of-the-world .specialWrapper #card3 .modal {width: 310px; margin:105px auto; text-align:left; overflow:hidden; display:block;}
.fragrances-of-the-world .specialWrapper #card3 #modalMask {width:100%; z-index: 800; background:rgba(217, 217, 217, 0.82); position:absolute; left:0; top: -25px; text-align:center;}
.fragrances-of-the-world .specialWrapper #card3 #modalMask.inactive, .fragrances-of-the-world .specialWrapper #card3 #modalMask.inactive .modal { left:-99999px; opacity:0;}
.fragrances-of-the-world .specialWrapper #card3 .modal.inactive { display:none;}
.fragrances-of-the-world .specialWrapper #card3 .modal .modaltitle, .fragrances-of-the-world .specialWrapper #card3 .modal .modaldescription {padding:25px; text-align:left; float:left;}
.fragrances-of-the-world .specialWrapper #card3 .modal .modaltitle {width:80%; float:left;}
.fragrances-of-the-world .specialWrapper #card3 .modal .modaltitle h2 {color:#ffffff; text-align:left; font-size: calc(16px + 0.5vw); float: left;}
.fragrances-of-the-world .specialWrapper #card3 .modal .modaldescription p {color:#ffffff;text-align:left; font-size: calc(6px + 0.5vw); padding:0;  line-height: calc(14px + 0.5vw);}
.fragrances-of-the-world .specialWrapper #card3 .modal .dismiss {background: url(cancel2.png) no-repeat right -4px;background-size: 28px; cursor:pointer;  float:right; display:inline-block; width:30px; height:31px; margin: 21px 20px 0 0px;}
.fragrances-of-the-world .specialWrapper #card3 .modal .modalimage {width:100%; height:120px; background-size:contain;}
.fragrances-of-the-world .specialWrapper #card3 .modal.family_09 .modaldescription p, .fragrances-of-the-world .specialWrapper #card3 .modal.family_09 .modaltitle h2 {text-shadow: 1px 1px 17px #b5922a;}
.fragrances-of-the-world .specialWrapper #card3 .modal.family_06 .modalimage {background:url(woody_oriental.png) no-repeat center top;}

@media (min-width : 220px) and (max-width : 560px) {
.fragrances-of-the-world .specialWrapper #card3 .result .resultTitle { font-size: calc(12px + 0.5vw);}
.fragrances-of-the-world .specialWrapper  #card2 .searchInner input {width:75%;}
 .fragrances-of-the-world .specialWrapper  #card3 #familyName_1, .fragrances-of-the-world .specialWrapper  #card3 #familyName_2, #card3 #familyName_3 { font-size: 17px; padding:37px 0; }
 .fragrances-of-the-world .specialWrapper  #card3 .sa {top:18px;}
}

@media (max-height : 768px)  and (max-width : 560px)  {
.fragrances-of-the-world .specialWrapper #card1 h1{font-size: calc(27px + 0.5vw); margin: 60px 0 0 0; padding: 0 4px;}
.fragrances-of-the-world .specialWrapper #card2 h1, .fragrances-of-the-world .specialWrapper #card0 h1, .fragrances-of-the-world .specialWrapper #card3 h1 {font-size: calc(27px + 0.5vw); margin: 15px 0 0 0; padding: 0 4px;}
.fragrances-of-the-world .specialWrapper #card1 h1 span, #card0 h1 span { font-size: calc(16px + 0.5vw);}
.fragrances-of-the-world .specialWrapper #card1 .logo, .fragrances-of-the-world .specialWrapper #card0 .logo { padding: 15px;}
.fragrances-of-the-world .specialWrapper #card2 .searchrow { padding: 17px;}
.fragrances-of-the-world .specialWrapper #card2 .searchInner span { background: url(search.png) no-repeat right 5px top 5px; background-size: 24px;}
.fragrances-of-the-world .specialWrapper #card2 .searchInner span.cancel {background: url(cancel.png) no-repeat right 5px top 5px;  background-size: 24px;}
.fragrances-of-the-world .specialWrapper #card3 .result {top: -11px;}
.fragrances-of-the-world .specialWrapper .footerrow { padding: 10px;}
.fragrances-of-the-world .specialWrapper #card3 .result .resultnotes { margin: 7px 0 0 0;}
}

@-webkit-keyframes rotation {
		from {
				-webkit-transform: rotate(0deg); -moz-transform : rotate(0deg); -ms-transform  : rotate(0deg); -o-transform : rotate(0deg);	 transform : rotate(0deg);
	  
		}
		to {
				-webkit-transform: rotate(359deg); -moz-transform : rotate(359deg); -ms-transform  : rotate(359deg); -o-transform : rotate(359deg);	 transform : rotate(359deg);
		}
}
@-webkit-keyframes stop {
		from {
				-webkit-transform: rotate(0deg); -moz-transform : rotate(0deg); -ms-transform  : rotate(0deg); -o-transform : rotate(0deg);	 transform : rotate(0deg);
	  
		}
		to {
				-webkit-transform: rotate(0deg); -moz-transform : rotate(0deg); -ms-transform  : rotate(0deg); -o-transform : rotate(0deg);	 transform : rotate(0deg);
		}
}


#DirectDebitForm { margin: 35px 0 10px 0px;}

@keyframes showcaseItem {
0% {  opacity: 0;}
30% {  opacity: 0; }
100% {  opacity: 1;}
  
}
 
.shop .shoppages, .store .shoppages {position:relative;}
.shop #cartIcon, .store #cartIcon , .shoppages #cartIcon { position: absolute;  top: 83px;  z-index: 890;  right: 60px;  padding: 10px 15px;  background: #ebebeb;  color: #000;  cursor: pointer;}
.shop #cartIcon:hover, .store #cartIcon:hover , .shoppages #cartIcon:hover {background:#d9d9d9;}
.shop #cartIcon:before, .store #cartIcon:before , .shoppages #cartIcon:before {content:url('/shop/assets/cart.svg');height: 15px;  width: 15px;  display: block;  transform: scale(1.5);  float: left;  margin: -1px 14px 0 0;}
.shop article .checkoutShowcase, .store article .checkoutShowcase, article .shoppages .checkoutShowcase {  display: flex;  width: 0%;  top: 0;  position: fixed;  z-index: 500;  overflow-y: auto;  background: #f2f2f2;  height: 100vh;  opacity: 0;  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;  -o-transition: all 0.4s ease-in-out;  transition: all 0.4s ease-in-out;  z-index: 1000;}
.shop article.showcase .checkoutShowcase, .store article.showcase .checkoutShowcase,  article.showcase .shoppages .checkoutShowcase {opacity:1; width:calc(100% - 165px);}
 
.shoppages .lowstock {	border-bottom: none !important;	text-decoration: none;	background: #62637c;	color: #fff;	padding: 5px;	display: inline-block;	margin: 0 0 30px 0;	color: #fff;	padding: 8px 7px 7px 17px;	letter-spacing: 5px;	font-size: 12px;	font-weight: normal;	font-family: 'coveslight';	text-transform: uppercase;}
.shoppages .checkoutShowcase {width:0%; top:0; position:fixed; z-index:500; overflow-y: auto; background: #f2f2f2; height:100vh; opacity:1; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; z-index:1000;}
.shoppages article.showcase .charityShowcase {opacity:1;width:calc(100% - 265px);}
.shoppages .checkoutShowcase .checkoutShowcaseItem {  padding: 3rem;   display: flex;   flex-wrap: wrap;   align-items: center;  opacity: 0;   animation: showcaseItem 1.5s ease forwards; width: 90%;}
.shoppages .checkoutShowcase span.scTrigger {  color: #30343b;  padding-left: 22px;  z-index: 400;  -webkit-transition: all 0.2s ease-in-out;  -moz-transition: all 0.2s ease-in-out;  -o-transition: all 0.2s ease-in-out;  transition: all 0.2s ease-in-out; cursor: pointer;  font-size: 32px;  position: absolute;  left: 22px;  top: 4px;}
.shoppages .checkoutShowcase span.scTrigger:hover { padding-left: 16px;}
.shoppages .checkoutShowcase .checkoutShowcaseItem > div {  flex: 0 0 50%;}
.shoppages .cartContent h2, .shoppages .checkout-form h3, .shoppages #similarProducts h3, .shoppages .checkout-form h2 {  letter-spacing: 7px;  font-size: 16px;  font-weight: normal;  width: 100%;  font-family: 'coveslight';  text-transform: uppercase;  margin: 0 0 35px 0;  line-height: 25px;}
.shoppages .itemDetails select { margin: 12px; padding: 12px 24px;  border: 1px solid #000; cursor:pointer;}
 .shoppages .slider .price{flex: 0 0 100%;}
 .shoppages .beforeSale {color: #FF0066; text-decoration:line-through; margin:0 20px 0 0; position: relative;}
 .shoppages .beforeSale, .shoppages .salePrice, .shoppages .itemDetails form .button span {border-bottom:0!important;}
 .shoppages #productFeed .beforeSale:before {content: "SALE"; margin: 0 12px 5px 0;  float: left;  background: #FF0066;  color: #fff;  padding: 8px 2px 7px 8px;  letter-spacing: 5px;  font-size: 10px;  font-weight: bold;  font-family: 'coveslight';  text-transform: uppercase; position: static;}
 .shoppages .slideCaption.saleItem h3{position:relative;}
 .shoppages .slideCaption.saleItem h3:before { content: "SALE";  display: block;  position: absolute;  top: -144px;  left: -55px;  background: #FF0066;  color: #fff;padding:10px 4px 7px 10px ;  letter-spacing: 7px;  font-size: 16px;  font-weight: bold;  font-family: 'coveslight';  text-transform: uppercase; }
 .shoppages #productFeed {flex: 0 0 100%; padding: 0 0 0 45px;display:flex; gap:95px; flex-wrap: wrap;}
 .shoppages #productFeed .product {flex: 0 0 18%; margin: 0 0 40px 0; flex-wrap: wrap;  display: flex;}
 .shoppages #productFeed .product .beforeSale, .shoppages #productFeed .product .salePrice {flex: 0 0 100%; width:100%; display:block;}
 .shoppages #productFeed .product img {width:100%;}
.shoppages #productFeed .product h2 {width: 100%;  max-width: unset;  color: #1d1e22;  font-family: 'glyphalt65bold';  text-align: left;  margin: 1rem 0;  font-size: 20px;  letter-spacing: 1px;  display: inline-block;}
.shoppages #productFeed .product .button {margin: 25px 0 0 0; align-self: end;}
 .shoppages .itemDetails {display:flex; position:relative;flex-wrap: wrap;}
 .shoppages .itemDetails > section {flex:0 0 40%;}
 .shoppages .itemDetails > section#productPhotography {  padding: 0 0 0 3.3%;}
 .shoppages .itemDetails form .button {  margin: 30px 0 0 0;}
 .shoppages  .thumbnails img { width: 100%;  cursor:pointer;}
 .shoppages .thumbnails { display: flex; gap: 18px;  margin: 18px 0 0 0;    flex-wrap: wrap;}
 .shoppages .thumbnails div {   flex: 0 0 15%;}
 .shoppages .galwrapper .wrap.first, .shoppages .galwrapper .wrap.first img {  max-width: 600px; width: 100%;}
 .shoppages .itemDetails .postage {  margin: 15px 0 !important;}
 .shoppages .itemDetails > span {position:absolute; letter-spacing: 6px; padding: 0 0 10px 0;  text-transform: uppercase;    font-size: 11px;    text-decoration: none;     line-height: 18px;top: -57px;  left: 43px;}
 .shoppages .itemDetails > span  a {text-decoration:none;  padding: 0 0 8px 0; }
 .shoppages .itemDetails > span  a:hover {    border-bottom: 1px solid #000;} 
.shopitem article.sale .beforeSale:before {  content: "SALE";  display: block;  position: absolute;  top: -32px;  left: 0px;  background: #FF0066;  color: #fff;  padding: 8px 2px 7px 8px;  letter-spacing: 5px;  font-size: 10px;  font-weight: bold;   font-family: 'coveslight';  text-transform: uppercase;}
 .shoppages .inputText {padding:9px 7px 11px 200px;}
.shoppages .checkoutShowcase .checkoutShowcaseItem > div {flex: 0 0 100%; padding: 0;}
.shoppages .checkoutShowcase .checkoutShowcaseItem > div.populated {flex: 0 0 50%; padding: 0 120px 0 0;}
.shoppages .checkoutShowcase .checkoutShowcaseItem .cartForm.populated {  padding: 60px 0 !important;}
 .shoppages .cart-items {  margin-bottom: 30px;}
 .shoppages #add-to-cart {overflow: hidden;}
 .shoppages .button.tocart span {padding-right: 50px;}
 .shoppages .cartContent strong {  letter-spacing: 2px;  line-height: 23px;  font-size: 14px;  text-shadow: 0 0 0 #1d1e22;  font-weight: normal;}
 .shoppages .button.tocart em.cartanim {filter: invert(1);content: url('/shop/assets/cart.svg');  position: absolute;  right: 15px; mix-blend-mode: difference; bottom: -24px;  width: 24px;  height: 24px;  opacity: 0;  animation: flyup 1.6s forwards;}
.shoppages .cart-items li {align-items: center;  display: flex; padding: 0 0 5px 0;}
.shoppages .cartContent.populated .cart-items li{ margin: 0 0 0 -29px;}
.shoppages .cart-items li img {max-width:80px; margin:0 15px;}
.shoppages .cart-items li .remove-item {-webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s;	margin: -70px 0 0 0;	cursor: pointer;}
.shoppages .cart-items li .remove-item:hover {color:#FF0066;}
.shoppages .cart-items li > strong {  margin: 0 15px;}
.shoppages .cart-items li .item-price {margin:0 30px 0 0;} 
.shoppages .cart-items li .qty-decrease, .shoppages .cart-items li .qty-increase {cursor:pointer;	display: inline-block;	height: 24px;	width: 24px;	margin: 0 10px; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s;}
.shoppages .cart-items li .qty-decrease:hover, .shoppages .cart-items li .qty-increase:hover {background:#30343B; color:#fff;}
.shoppages .cart-items li .qty-decrease { position: relative;  top: -2px;}
.shoppages .cart-items li .qty-increase {  font-size: 20px;  line-height: 24px;}
.shoppages .cart-postage, .shoppages  .cart-total {  padding: 15px 0;  border-bottom: 1px solid #cecece;}
.shoppages .cartContent {  padding: 0 200px 0 0;}
.shoppages .checkout-form
.shoppages .checkout-form #submit {  margin: 50px 0 0 0;}
.shoppages .checkout-form-group { display: flex; border-bottom: 1px solid #cecece; align-items: center; gap: 20px; margin-top: 6px; }
.shoppages .checkout-form-group label { text-transform: uppercase; letter-spacing: 7px; white-space: nowrap; font-size: 12px; margin-bottom: -18px;}
.shoppages .checkout-form-group .inputText {position: relative; border-bottom: none; height: auto;margin: 8px 0 0 0; padding: 9px 7px 11px 16px; left: auto; top: auto;} 
.shoppages #card-element {  margin: 30px 0;}
.shoppages #card-element.disabled { pointer-events: none; opacity: 0.3; }
.shoppages .bankcard label {line-height: 33px;  position: relative;  letter-spacing: 7px;  text-transform: uppercase;  font-size: 12px;}
.shoppages #newsletterOptIn {display: inline-block;  height: 18px;  width: 18px;  background: #f2f2f2;  position: relative;  top: 4px;  z-index: 999;  -webkit-appearance: auto;}
.shoppages .quantity-control {margin-left: auto;min-width: 105px;}
.shoppages #shop-payment-btns {display: flex;  flex-wrap: wrap;  align-items: center;  justify-content: start;  margin: 35px 0 0 0; gap:20px;}
.shoppages #payment-message { margin-top:20px; }
.shoppages #stripeContainer, .shoppages #paypalContainer {margin-top: 48px;}
.shoppages #paypalContainer.paypal-loading:before { content: ''; position:absolute; display: block; width: 32px; height: 32px; border: 1px solid #1d1e22; border-bottom-color: transparent; border-radius: 50%; display: inline-block; box-sizing: border-box; animation: rotation 1s linear infinite; } 
@keyframes rotation { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); }
} 
.shoppages .button.altbutton.active {background-color: #d3d7d8;}
.shoppages .button.altbutton.active span {color: #1d1e22;}
.shoppages #cart-personal-details.disabled {pointer-events: none; opacity:0.5;}
.shoppages #cart-edit-details {margin-bottom: 20px;}
.shoppages #similarProducts {  margin-top: 150px;}
.shoppages #similarProducts #productFeed h2{ text-transform:none;}
.shoppages #similarProducts #productFeed { padding: 0 0 50px 0px;}

@keyframes flyup {
  0% {
    bottom: -24px;
    opacity: 0;
  }
   15% {
    bottom: -24px;
    opacity: 0;
  }
  25% {
    bottom: 13px;
    opacity: 1;
  }
  60% {
    bottom: 13px;
    opacity: 1;
  }
  100% {
    bottom: 70%;
    opacity: 0;
  }
}
 
 
 /* FOOTER */
footer{margin: 100px 0 0 45px; position:relative;}
footer #subFooter {background:#222325; display:flex; padding:40px 60px 0px 60px;}
footer #subFooter > div:last-child {flex-basis: 22%; margin-left: 0;}
footer #subFooter > div {flex-grow: 0; flex-shrink: 1;  flex-basis: 12%; margin-left: auto;}
footer .subNav { flex-basis: 15%; }
footer .subNav nav li a { padding: 0 0 11px 0; font-weight: normal; position:relative; letter-spacing: 7px; border-bottom: 2px solid #222325; text-decoration:none;  text-transform: uppercase;  font-size: 12px;   color: #ffffff; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; display:inline-block!important;}
footer .subNav nav li a:hover { color: #858382; border-bottom: 2px solid #858382; text-decoration:none;}
footer .smallprint { flex-basis: 50%!important; display:flex; color:#ffffff; margin-left: 0!important;}
footer .smallprint svg { margin: 0 25px 0 0;}
footer .smallprint p { margin: -11px 0 0 0;  padding: 0 0 7px 70px; font-size: 12px; color: #ffffff; line-height: 28px;}
footer .smallprint p a	{  font-size: 12px;  color: #ffffff;  line-height: 31px; text-decoration:underline;}
footer .subNav svg path { fill: #ffffff;}
footer .subNav li a {color: #ffffff; font-weight: normal; letter-spacing: 7px; text-transform: uppercase;  font-size: 12px!important;  padding: 0 0 11px 0; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s;}
footer .subNav li a:hover {color: #858382; text-decoration:none; border-bottom: 1px solid  transparent; }
footer .subNav ul.action, footer .subNav ul.social {padding: 0 0 0 45px;}
footer .subNav > span {color:#ffffff; padding: 0 25px 0 45px;}
footer .subNav ul li {  padding: 0 0 24px 0;}
footer .subNav ul.action li {  padding: 0 0 20px 0;}
 
 
 
 @keyframes device1 {
0% {  opacity: 0; top:25px;}
30% {  opacity: 0; }
100% {  opacity: 1; top:0px;}
    
}
@keyframes device2 {
0% {  opacity: 0; top:25px; }
30% {  opacity: 0; }
 100% {  opacity: 1; top:0px;}
   
}
@keyframes device3 {
0% {  opacity: 0; bottom:25px;}
30% {  opacity: 0; }
100% {  opacity: 1; bottom:0px;}
  
}
@keyframes device4 {
0% {  opacity: 0; bottom:25px;}
30% {  opacity: 0; }
100% {  opacity: 1; bottom:0px;}
  
}

@keyframes poly {
	0% {
		-webkit-clip-path:
         polygon(0 0, 100% 0, 100% 89%, 50% 100%);
 clip-path:
    polygon(0 0, 100% 0, 100% 89%, 50% 100%);
	}
	50% {
		-webkit-clip-path:
         polygon(0 0, 100% 0, 100% 80%, 15% 94%);
 clip-path:
    polygon(0 0, 100% 0, 100% 80%, 15% 94%);
	}
	100% {
		-webkit-clip-path:
         polygon(
            0 0, 100% 0, 100% 89%, 50% 100%);
 clip-path:
         polygon(
            0 0, 100% 0, 100% 89%, 50% 100%);
	}
}
 
  /* ANIMATION */
 @keyframes flyout {
  0% { opacity: 0;  }
  5% { opacity: 0.2; }
  17% { opacity: 0.75; }
  25% { opacity: 0.2;border-top-color:#5eb4ef; border-left-color:#d9d9d9;border-right-color:#d9d9d9;border-bottom-color:#d9d9d9; }
  32% { opacity: 0.75;border-top-color:#d9d9d9; border-left-color:#5eb4ef;border-right-color:#d9d9d9;border-bottom-color:#d9d9d9; }
  39% { opacity: 0.2;border-top-color:#d9d9d9; border-left-color:#d9d9d9;border-right-color:#5eb4ef;border-bottom-color:#d9d9d9; }
  46% { opacity: 0.75;border-top-color:#d9d9d9; border-left-color:#d9d9d9;border-right-color:#d9d9d9;border-bottom-color:#5eb4ef;}
  100% {  opacity: 1;top: 75px; left: 45px; position:absolute; width:450px;}
 
}

@media (max-width: 1800px) { 
  #portfolio .row.rollerInvert .rollerImages {padding: 0 50px 0 0; transform: translate(20px, 40px);}
  #portfolio .row .rollerImages {transform: translate(-20px, -40px);}
  #portfolio .rollerImages.phone img {width: 100%; object-fit: contain;}
  .blog #blogfilter .archive li:not(:first-child){width: 440px;}
  .blog #blogfilter > div > div.mostread {  flex: 0 0 400px;}
}

@media (max-width: 1630px) { 
.button {margin:25px  0 0 0;}
 .triGrid .row > div .subNav ul li a {  width: min-content; display:inline;  word-wrap: break-word;}
 .triGrid .row > div .subNav ul li {  margin: 0; }
 .triGrid .row > div .subNav ul li:last-child { padding: 10px  0 0 0;}
 .triGrid .row > div .subNav ul.social li:last-child {padding:0;}
  .triGrid .row > div .subNav ul.social {transform:translate3d(-10px, 0, 0 );}
 .heading h1, .heading h2 {margin: 0 0 21px 0;}
 .triGrid .row.substitute1 > div .heading {    margin: 20px 0 0 0;}
 .shoppages .slideCaption.saleItem h3::before {top: -169px;}

}


@media (max-width: 1580px) { 
	#portfolio .chapter .var002 p {  max-width: 350px;  padding: 0 25px;  transform: translate(0px);}
	#portfolio .row .rollerImages.desktop {  padding: 70px 20px 70px 70px;}
	#portfolio .rollerImages.desktop ul {height: 70vh;}
	#portfolio .rollerImages.desktop img { height: 70vh;}
	#portfolio .rollerImages.desktop > div {padding: 7px 7px 8px 0;}
	#portfolio .row .rollerImages.desktop {  padding: 70px 10px 70px 70px;}
	#portfolio .row.roller .rollerText.imgShrink .waypoint img {  max-width: 220px;}
	#portfolio .row.roller .rollerText.imgShrink .waypoint p { max-width: 50%;}
	

}


@media (max-width: 1500px) { 
#intro >div:last-child img {    max-width: 600px;}
#intro >div:last-child { flex: 0 0 50%;  max-width: 750px;}
.textOnly2Col { padding: 100px 50px 100px 90px;}
.textOnly2Col > div { flex: 0 0 50%;}
.post .passage {  margin: 100px 45px 100px 0;}
.post .passage > div img { width: 100%;}
#portfolio .devicePair {  display: block;}
#portfolio .chapter .mag .magvar004 .magcell_1 {  align-content: start;}
#portfolio .chapter .mag .magvar004 .magcell_2 img {  flex: 0 0 40%;  width: 50%;  height: auto;  padding: 12px;  object-fit: contain;  position: relative;  left: -25px;}
#portfolio .rollerImages.phone img {width: auto; object-fit: contain;}
#portfolio .row.roller .rollerText {align-items: center;}
#portfolio .chapter.noTestimonial .imageQuote .noTestimonial p {max-width:90%;}
#portfolio .chapter.noTestimonial .imageQuote .noTestimonial {padding: 0 40px;}

.simpleBody > div {display:flex; gap:5%;}
.simpleBody > div p { flex:0 0 30%;}
}

@media only screen and (max-width: 1435px) and (min-width: 1321px) {
.button {height: 42px; line-height: 42px;}
.shoppages .slideCaption.saleItem h3::before {top: -173px;}
.subNav img {  max-height: 20px;  max-width: 20px !important;}
.subNav ul.action { padding: 0 25px;}
.subNav ul.action, .subNav ul.social, .subNav > span { padding: 0 25px;}
.triGrid .row > div .subNav ul.social {  transform: translate3d(-5px, 0, 0); }  
}
  
@media (max-width: 1435px) {
 #postLoop .latestCaption {  margin-top: 0px;}
#postLoop .latestCaption p {  padding: 0;}
#postLoop .latestContent { width: auto !important;}
#postLoop { padding: 100px 53px 20px 48px;}
#postLoop .latestCaption h3 {font-size:31px;}
.projects .projects .propertyTiles .row {flex-wrap: wrap;}
.projects .projects .propertyTiles .row .propertyTile.portrait { width: 48%;}
.projects .projects .propertyTiles .row .propertyTile.landscape{ width: 100%; padding: 0 45px 80px 0;}
#portfolio .chapter .var003_1 div:first-child {  transform: rotate(-45deg) scale(1) translate(36%, 90%);}
#portfolio .chapter .var003_1 div:last-child {  transform: rotate(45deg) scale(0.9) translate(7%, 16%);}
#portfolio .chapter .slider .slideContent {height: auto;}
#portfolio .chapter .var006_2 img { max-width: 80%;  margin: 25px 0;   transform: translate(25%, 0px);}
 
#portfolio .chapter .mag .magvar003 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(3, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .mag .magvar003 .magcell_1 { grid-area: 1 / 1 / 4 / 3; }
#portfolio .chapter .mag .magvar003 .magcell_2 { grid-area: 3 / 3 / 4 / 5; }
#portfolio .chapter .mag .magvar003 .magcell_2 p { columns: 2; column-gap: 75px; max-width:unset;}
#portfolio .chapter .mag .magvar003 .magcell_1 div:first-child { transform:rotate(-45deg) scale(0.9) translate(36%, 62%);}
#portfolio .chapter .mag .magvar003 .magcell_1 div:last-child { transform:rotate(45deg) scale(0.8) translate(-16%, 6%);}
 
#portfolio .rollerImages.desktop ul {height: 60vh;}
#portfolio .rollerImages.desktop img { height: 60vh;}

.slideContent.finalSlide  > div:before {content:url('clip-l-t.svg'); position:absolute; left: 30px; top: 10px;  transform: scale(2);}
.slideContent.finalSlide  > div:after{content:url('clip-l-b.svg'); position:absolute; left: 60px; bottom: -40px;  transform: scale(2);}
.slideContent.finalSlide:before {content:url('clip-r-b.svg'); position:absolute;right: 130px;  bottom: 30px;  transform: scale(2);}


#portfolio .rollerImages.phone ul { overflow:hidden; height: 645.391px;  z-index: 15;}
#portfolio .rollerImages.phone img{ height: 645.391px; padding:10px !important;}
#portfolio .rollerImages.phone {  transform: translate(-20px, -47px)!important;  justify-content: flex-start;}
#portfolio .rollerInvert .rollerImages.phone { justify-content: flex-end;}
}
  
  
  
  @media (max-width: 1370px) { 
 .slider .slideContentInner { max-width: 830px;  margin: 0 25px 0 0;}
.slider .slideContent {  height: auto;}
.slider .slideCaption > span {font-size: 11px; left: -486px;}
.slider .slideCaption {margin-top:0; padding: 25px 45px;}
.slider .slideCaption h3 {  margin: 0 0 20px 0;  font-size: 31px; }
.button {margin:25px 0 0 0;}
.button.altbutton span, .button span{padding: 0 15px;}
.slider .slideCaption { align-content: flex-start;  margin: 25px 0 0 0; }
 footer #subFooter {flex-wrap: wrap;}
footer #subFooter > div	 { flex: 0 0 100%;  flex-basis: 25% !important;}
footer #subFooter > div:first-child {flex-basis: 100% !important; margin:0 0 40px 0;}
footer .smallprint p { line-height: 21px;}
footer #subFooter > div:nth-child(2) {    margin: 0 0 0 70px;  padding: 0 0 0 20%;}
#postLoop .latestCaption { width: 100%;  padding: 25px 45px;}
#portfolio .chapter .var001_2 {  grid-area: 2 / 3 / 4 / 5;}
#portfolio .chapter .var002_2 { grid-area: 3 / 1 / 6 / 3;}
#portfolio .chapter .var002_3 {  grid-area: 1 / 4 / 2 / 5;}
#portfolio .chapter .var002 p { transform: unset;}
#portfolio .chapter .var007_1 {   grid-area: 1 / 1 / 3 / 2;}
#portfolio .chapter .var007_2 {   grid-area: 1 / 2 / 3 / 3;}
#portfolio .chapter .var007_3 {    grid-area: 1 / 3 / 3 / 4;}
#portfolio .chapter .var007_4 {  grid-area: 3 / 1 / 3 / 4;}
#portfolio .chapter .var007 p {  transform: unset;}
#portfolio .chapter .var007 {grid-template-columns: repeat(3, 1fr);}
#portfolio .chapter .var004_2 img { transform: translate(2%, 0px);}

#portfolio .deviceDesktop { padding: 0;}
#portfolio .deviceDesktop .row.roller .rollerText img {display:none;}
#portfolio .row.roller .rollerText.imgShrink .waypoint p { max-width: unset; padding: 0 0 0 25px; margin: 140px 0px 0 0px;}
#portfolio .row .rollerImages.desktop {  padding: 70px 10px 70px 40px;  }

#portfolio .chapter.noTestimonial .imageQuote .noTestimonial h3 {margin: 35px 0;}
#portfolio .chapter.noTestimonial .imageQuote .noTestimonial p  {margin: 0 0 35px 0;}

#portfolio .chapter .mag .magvar018 {display: grid!important;grid-template-columns: repeat(4, 1fr);grid-template-rows: repeat(2, 0fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .mag .magvar018 .magcell_1 {grid-area: 1 / 1 / 2 / 4;    display: flex;   align-items: center;   gap: 25px;    flex-wrap: wrap;}
#portfolio .chapter .mag .magvar018 .magcell_1 img {flex: 1 1 15%;}
#portfolio .chapter .mag .magvar018 .magcell_2 p{ max-width:unset; columns: 2; column-gap: 75px; padding: 75px 0 0 0;} 
#portfolio .chapter .mag .magvar018 .magcell_2 { grid-area: 2 / 1 / 3 / 3; }

#portfolio .chapter .mag .magvar018 .magcell_1 img { flex: 0 0 22%;}

#portfolio .rollerImages.desktop ul { height: 589.6px;}
#portfolio .rollerImages.desktop img{ height: 589.6px;}

#portfolio .textOnly2Col div {  columns:2; gap:45px; flex: 0 0 75%;}

#portfolio .chapter .mag .magvar022 .magcell_3 { grid-area: 3 / 1 / 2 / 4; display: flex; margin: 80px 0 0 0;}
#portfolio .chapter .mag .magvar022 {  grid-template-rows: repeat(2, 1fr);}
#portfolio .chapter .mag .magvar022 .magcell_3 div { columns: 2;}

#spotlight > div:first-child img { max-width: 300px;}
#spotlight > div:first-child {  flex: 0 0 300px;}
#spotlight > div:first-child > span {width: 100%;}
#spotlight > div:nth-child(2) {  flex: 0 0 90px; height: 484px;}
#spotlight > div:nth-child(2) img {  margin: 20px 0;}
#spotlight > div:last-child {  padding: 31px 50px 0px 50px;}
#spotlight > div:nth-child(2) h2{bottom: 253px;}
#spotlight > div:last-child > span {height:120px;width:120px;}

.shoppages .slideCaption.saleItem h3::before {top: -50px;  left: -45px;}
.shoppages .checkoutShowcase .checkoutShowcaseItem {width:100%;}
 
 .shoppages #productFeed .product {flex: 0 0 25%; margin: 0 0 40px 0; flex-wrap: wrap;  display: flex;}
  }

@media (max-width: 1370px) and (min-width: 1321px) {
  .shop article.showcase .checkoutShowcase, .store article.showcase .checkoutShowcase, article.showcase .shoppages .checkoutShowcase {
  width: calc(100% - 265px);
  }
}

 @media (max-width: 1320px) {
#splash #splashGlyphs span div i {padding: 50px 0;}
#wrapper > header section { padding: 70px 0 0 0px; width: 80px;}
article {  width: calc(100vw - 182px);}
header section.usual #logo {  transform: translateX(-9px);  margin: 0 0 0 -8px;   position: fixed;   z-index: 600;   max-width: 68px; }
#splash #splashGlyphs span {transform:scale(100%)!important;}
.triGrid .row > div:last-child, .triGrid .row.alt > div:first-child {display:none;}
.triGrid .row.alt > div:last-child {display:inline;}
.triGrid .row > div { flex: 0 0 50%; }
.triGrid .row.substitute1 {flex-wrap:wrap;}
.triGrid .row.substitute1 > div {  flex: 0 0 100%;}
.triGrid .row.alt > div:nth-child(2n) {    order: 3;}
.triGrid .row.substitute1 > div {  display: inline;  width: 100%;    flex: 0 0 100%;  padding: 45px 0;  }
.triGrid .row.substitute1 > div:first-child { display: inline;   width: 100%;}
.triGrid .row.substitute1 > div ul.core {display:flex; flex-wrap: wrap;}
.triGrid .row.substitute1 > div ul.core li {flex:0 0 50%;}
.triGrid .subNav ul.action { flex-wrap: wrap;   display: flex;}
.triGrid .subNav ul.action li {flex:0 0 50%;}
.triGrid .row.substitute1 > div:last-child {display:none;}
.newsletter article.showcase .newsletterShowcase {opacity:1; width:calc(100% - 165px);}
.newsletter .newsletterNav { padding: 100px 30px;}
.newsletter .newsletterShowcase span.scTrigger {left: 162px;}
.newsletter .newsletterShowcase span.upTrigger {left: 179px;}
#portfolio .chapter .var003_2 p { columns: 1;  margin:15% 0 0 0;}
#portfolio .chapter .var003_2 {   grid-area: 3 / 3 / 2 / 5;}
#portfolio .chapter .imageQuote > div:first-child { min-width: unset;}
#portfolio .chapter .imageQuote {  max-width: unset;   left: -190px;}
#portfolio .chapter .imageQuote .shortTestimonial {  max-width: unset;}


#portfolio .chapter .mag .magvar004 { display: grid; grid-template-columns: repeat(3, 1fr);  grid-template-rows: repeat(1, 1fr); grid-column-gap: 10px;  grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar004 .magcell_1{ grid-area: 1 / 1 / 2 / 4; margin:0 0 90px 0;}
#portfolio .chapter .mag .magvar004 .magcell_1 p {    max-width: 75%;}
#portfolio .chapter .mag .magvar004 .magcell_2 { grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar004 .magcell_3 { grid-area: 2 / 2 / 3 / 4; } 
#portfolio .chapter .mag .magvar004 .magcell_1 h3 { width: 100%;  max-width: unset;}
#portfolio .chapter .mag .magvar004 .magcell_2 img { flex: 0 0 40%;  width: 50%;  height: auto;   padding: 28px;    object-fit: contain;   position: relative;    left: -25px;}

.my-room-outside #portfolio .chapter .mag .magvar014 .magcell_2 img { flex: 0 0 62%; height: auto;  padding: 0 0 22px 0;  object-fit: unset; width:5%; position: relative; left: 30px;}


#portfolio .row .rollerImages.desktop {  padding: 70px 10px 70px 30px;}
#portfolio .deviceDesktop .row .rollerText .waypoint {margin:350px 0;}
#portfolio .chapter.noTestimonial .imageQuote { width: calc(100% + 115px); align-items: start;}
#portfolio .chapter.noTestimonial .imageQuote { left: -165px; }
#portfolio .chapter.noTestimonial .imageQuote > div:first-child {padding: 0 0 0 115px; flex: 0 0 50%}
#portfolio .chapter.noTestimonial.alt .imageQuote > div:first-child {padding:0;}
#portfolio .chapter.noTestimonial .imageQuote > div:first-child  img{  margin: -70px 0 0 0;}
#portfolio .chapter.noTestimonial .imageQuote .noTestimonial p {max-width:unset;}
#portfolio .chapter.noTestimonial .imageQuote .noTestimonial { padding: 0 30px;}

#portfolio .chapter.noTestimonial.alt .imageQuote > div:first-child img {  margin: 0px 0 0 0; }
#portfolio .chapter.noTestimonial.alt .imageQuote {   width: 80vw;  display: flex;  align-items: center;}
.shoppages .checkoutShowcase .checkoutShowcaseItem > div.populated {  flex: 0 0 100%;  padding: 70px 0 0 0;}
.shoppages .checkoutShowcase .checkoutShowcaseItem .cartForm.populated {  padding: 80px 0 !important;}

#dbanner {margin: 110px 0 0 45px; max-width: 790px;}

}
 
@media (max-width: 1240px) { 
#introCaption { padding: 25px 45px;}
#intro >div:first-child {flex: 0 0 50%;}
.grid_imgGrid{padding: 0 45px 0 0px; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(9, 1fr); grid-column-gap: 25px; grid-row-gap: 25px;   max-width: 60%;         margin: 0 0 130px 0;}
.grid_imgGrid .img1 { grid-area: 1 / 1 / 5 / 5; }
.grid_imgGrid .img2 { grid-area: 6 / 1 / 8 / 3; transform: translate3d(130%, -5px, 0px);}
.grid_imgGrid .img3 { grid-area: 6 / 3 / 8 / 5; transform: translate3d(130%, -5px, 0px);}
.grid_imgGrid .img4 { grid-area: 8 / 1 / 10 / 3; transform: translate3d(130%, -5px, 0px);}
.grid_imgGrid .img5 { grid-area: 8 / 3 / 10 / 5;  transform: translate3d(130%, -5px, 0px);}
.grid_imgGrid .img6 {  grid-area: 5 / 1 / 5 / 6;  padding: 52px 0 0 0;}
.grid_imgGrid .img7 {  grid-area: 5 / 1 / 6 / 5;  padding: 0 0 20px 0;  display: flex;  align-items: start;  justify-content: start;}

.about .grid_imgGrid { margin: 0px;}

#portfolio .chapter .mag .magvar003 .magcell_2 {  grid-area: 4 / 1 / 4 / 5;}
#portfolio .chapter .mag .magvar003 .magcell_1 div:first-child { transform: rotate(-45deg) scale(1) translate(58%, 75%);}
#portfolio .chapter .mag .magvar003 .magcell_1 div:last-child {  transform: rotate(45deg) scale(1) translate(2%, -14%);}

#direct {width:75%; margin: 12.6rem 2rem 2rem 45px !important;}
.project-close #direct .newsletterOnboard {flex-wrap:wrap;}
.project-close #direct .newsletterOnboard > div:last-child, .project-close #direct .newsletterOnboard > div:first-child {flex:100%; min-height: 260px;}
.project-close #direct .newsletterOnboard > div:last-child{margin:0 0 30px -77px;}
.project-close #direct .newsletterOnboard > div:last-child {  order:1; }
.project-close #direct .newsletterOnboard > div:first-child {order:2;}

.newsletter .newsletterOnboard {flex-wrap:wrap;}
 .newsletter .newsletterOnboard > div:last-child, .project-close #direct .newsletterOnboard > div:first-child {flex:100%; min-height: 260px;}
 .newsletter .newsletterOnboard > div:last-child{margin:0 0 30px -77px;}
 .newsletter .newsletterOnboard > div:last-child {  order:1; }
 .newsletter .newsletterOnboard > div:first-child {order:2;}

#portfolio .row.roller.wide .rollerImages.mainimgShrink img {  height: 43vh;}
#portfolio .row.roller.wide .rollerImages.mainimgShrink ul {  height: 43vh;}

.blog #blogfilter > div {flex-wrap: wrap;flex-flow: column-reverse;}
    .blog #blogfilter .random { width: 100%;  text-align: right;}
 .blog #blogfilter > div > div.mostread {  flex: 0 0 100%;  width: 100%;  padding: 25px 17px;  text-align: right;}
.blog #blogfilter > div > div {width: 100%;}
.blog #blogfilter .archive ul{padding: 0px 16px 0 0;}
.blog #blogfilter .archive ul li:first-child, .blog #blogfilter .mostread ul li:first-child {margin: 0 0 0px 0;}
}
 
@media (max-width: 1155px) {
.post .blogFlyoutContainer {flex-wrap: wrap; justify-content: center;}
.post .postnavigation {margin: 400px 0 0 0;  }
.post .postnavigation td:last-child { padding: 0 0 0 17px;}
.post .blogFlyout {padding:30px;  left: 50%; transform: translate(-225px , 0px);}
.post .nextProject:before {right:4px;}

#portfolio .chapter .var001_1 { grid-area: 1 / 1 / 3 / 4;}
 
#portfolio .chapter .mag .magvar003 {display: grid!important;  grid-template-columns: repeat(1, 1fr);  grid-template-rows: repeat(1, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .mag .magvar003 .magcell_1 { grid-area: 1 / 1 / 2 / 3;}
#portfolio .chapter .mag .magvar003 .magcell_2 {grid-area: 2 / 1 / 3 / 3;}
#portfolio .chapter .mag .magvar003 .magcell_2 p { columns: 2; column-gap: 75px; max-width:unset;}
#portfolio .chapter .mag .magvar003 .magcell_1 div:first-child { transform: rotate(-45deg) scale(0.6) translate(15%, 34%);}
#portfolio .chapter .mag .magvar003 .magcell_1 div:last-child { transform:rotate(45deg) scale(0.6) translate(-53%, 6%); height: 400px;}

#portfolio .chapter .mag .magvar007 {display: grid!important; grid-template-columns:repeat(3, 1fr); grid-template-rows: repeat(2, 0fr); grid-column-gap: 25px; grid-row-gap: 25px;}
#portfolio .chapter .mag .magvar007 .magcell_1 { grid-area: 2 / 3 / 2 / 3; }
#portfolio .chapter .mag .magvar007 .magcell_2 { grid-area: 2 / 2 / 2 / 2; }
#portfolio .chapter .mag .magvar007 .magcell_3 { grid-area: 2 / 1 / 3 / 1; }
#portfolio .chapter .mag .magvar007 .magcell_4 { grid-area: 1 / 1 / 1 / 4; }
#portfolio .chapter .mag .magvar007 .magcell_4 p { max-width:unset; margin:0 0 60px 0;}
#portfolio .chapter .mag .magvar007 > div { display: inline; align-items: center;}

#portfolio .chapter .mag .magvar014 .magcell_2 img { flex:unset; height: auto;  margin: 0 0 0 65px;  object-fit: unset; width:165px; position: relative; left: -50px;}
.wrap-it-up #portfolio .chapter .mag .magvar014 .magcell_2 img {left:-50px;}
.my-room-outside #portfolio .chapter .mag .magvar014 .magcell_2 img { flex: 0 0 62%; height: auto;  padding: 0 0 22px 0;  object-fit: unset; width:5%; position: relative; left: -30px;}


#portfolio .chapter .mag .magvar016 {display: grid; grid-template-columns:repeat(2, 1fr); grid-template-rows: repeat(3, 0fr); grid-column-gap: 10px; grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar016 .magcell_1 { grid-area: 1 / 1 / 2 / 2; }
#portfolio .chapter .mag .magvar016 .magcell_2 { grid-area: 1 / 2 / 2 / 3; }
#portfolio .chapter .mag .magvar016 .magcell_3 { grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar016 .magcell_4 { grid-area:  3 / 1 / 4 / 3;  display: flex;  justify-content: end;}
#portfolio .chapter .mag .magvar016 .magcell_5 {grid-area: 2 / 2 / 3 / 3; }
#portfolio .chapter .mag .magvar016 .magcell_4 p { columns: 1; column-gap: 75px; max-width:unset; padding: 75px 0 0 0px;}

#portfolio .chapter .mag .magvar022 .magcell_3 {  margin: 40px 0 0 0;  }

.shoppages .itemDetails > section {  flex: 0 0 47%;}

 @keyframes flyout {
  0% { opacity: 0;  }
  5% { opacity: 0.2; }
  17% { opacity: 0.75; }
  25% { opacity: 0.2;border-top-color:#5eb4ef; border-left-color:#d9d9d9;border-right-color:#d9d9d9;border-bottom-color:#d9d9d9; }
  32% { opacity: 0.75;border-top-color:#d9d9d9; border-left-color:#5eb4ef;border-right-color:#d9d9d9;border-bottom-color:#d9d9d9; }
  39% { opacity: 0.2;border-top-color:#d9d9d9; border-left-color:#d9d9d9;border-right-color:#5eb4ef;border-bottom-color:#d9d9d9; }
  46% { opacity: 0.75;border-top-color:#d9d9d9; border-left-color:#d9d9d9;border-right-color:#d9d9d9;border-bottom-color:#5eb4ef;}
  100% {  opacity: 1;top: 75px; left: 50%; position:absolute; width:450px;}
 } 
 
 .post .postnavigation td:hover a.nextProject:after {	border-bottom: 2px solid #5eb4ef;	content: "";	display: block;	width: 13px;	position: absolute;	left: 17px;	bottom: 0;}
 
 .fragrances-of-the-world .specialWrapper #card3 .searching {top: 38%;}
 
}
@media (max-width: 1098px) {
	#dbanner {background: #d3d7d8; flex-wrap: wrap;  margin: 110px 0 110px 45px; 
}
 
 @media (max-width: 1080px) { 
 .home .triGrid q strong.captionOverflow strong {display:none;}
 .home .triGrid q strong:after {content:"...";}
 .home.subSplash #splash #splashContent {  overflow-x:hidden;	}
.home .slick-track .slick-slide[data-slick-index="6"] {width: 100% !important;}
.home .slick-track .slick-slide[data-slick-index="6"] div div {  width: 92.6% !important;  }
 .slideContent.finalSlide  > div:before {content:url('clip-l-t.svg'); position:absolute; left: -10px;top: 0px; transform: scale(1);}
.slideContent.finalSlide  > div:after{content:url('clip-l-b.svg'); position:absolute; left: 0px; bottom: -40px;  transform: scale(1);}
.slideContent.finalSlide:before {content:url('clip-r-b.svg'); position:absolute;right: 50px;  bottom: -10px; transform: scale(1);}
 /*.home #splash #splashContent #splashIntro  p.highlight:before {  content: url("/images/quote.svg");  position: absolute;  bottom: -25px;  right: -25px;  transform: scale(0.3);}*/
 .home #splash #splashContent #splashIntro  p.highlight:before { display:none;}
 #splash #splashGlyphs span div i {padding: 0;}
  #wrapper > header {  top: 0; position: fixed;  width: 100%;  overflow: hidden;  height: 36px;  background: transparent;   z-index: 900;   left: 0;   display: block;  -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
  #wrapper > header.south {background: #f2f2f2; z-index:9999; height:43px;  -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}
	#wrapper > header.south.active , #wrapper > header.active  {height: 100vh; position:fixed;}
 .slider .slideContentInner  { display: inline;  max-width: unset;  width: 50%; margin: 0;}
 .slick-track {  width: 100% !important;  transform: unset !important; flex-wrap: wrap; display:flex!important;}
 .variable.slider.logoClip { transform: unset; }
.slider .slick-slide { opacity:1!important; margin: 0px 0px 27px 27px;}
#wrapper  { display: inline;}
article {width: 100%;}
/*.shopitem article {  width: calc(100vw - 182px); }*/
.shoppages #similarProducts #productFeed {   padding: 0 0 50px 0px;  gap: 30px;   width: calc(100vw - 182px);}

  header nav ul {opacity:0;display:inline; -webkit-clip-path:  polygon(0 0, 100% 0, 100% 89%, 50% 100%); clip-path:  polygon(0 0, 100% 0, 100% 89%, 50% 100%); top: 0;  background:transparent; width: 50%;   padding: 45px 25px 105px 25px;  top:0; right: -600px;position:fixed; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out;}
 header nav > span {-webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; z-index: 900; border-right: 3px solid #737373; border-bottom: 0px solid #737373; border-left: 3px solid #737373; padding: 4px; flex: unset; width: 20px; cursor:pointer; transform: skew(-45deg, 0deg); height: 17px; position: fixed; padding: 11px!important;}
  header nav > span:hover {border-right: 3px solid #5eb4ef; border-left: 3px solid #5eb4ef;}
  header nav> span:before {opacity:0; top:-39;position: relative; left:0; -webkit-transition: all 1.5s ease-in-out; -moz-transition: all 1.5s ease-in-out; -o-transition: all 1.5s ease-in-out; transition: all 1.5s ease-in-out;}
  header nav > span:after {opacity:0; top:11;position: relative; right:0; -webkit-transition: all 1.5s ease-in-out; -moz-transition: all 1.5s ease-in-out; -o-transition: all 1.5s ease-in-out; transition: all 1.5s ease-in-out;}
  header nav.active > span:before { display: block;    opacity: 1;    height: 12px;    width: 3px;    background: #5eb4ef;    position: relative;    content: "";    top: -11px;  left: -23px;}
  header nav.active > span:after { display: block;   opacity: 1;    height: 12px;    width: 3px;    background: #5eb4ef;    position: relative;    content: "";   top: -12px;    left: 20px;}
  header nav{justify-content: end; padding: 15px 15px 0 0;text-align:right; position:static;   display: flex;}
  header nav.active ul  { right: 0; opacity:1;  background: #ffffff;  z-index: 600; }
header nav ul li a {color: #858382;}
#wrapper > header section { padding: 0px 0 0 0px;}
#wrapper > header {  top: 0; position: absolute; width:100%; overflow-x: hidden;}
.home.subSplash #splash #splashContent {  display: flex;  flex-wrap: wrap;}
.home.subSplash #splash #splashContent > div {  width: 100%;   max-width: unset !important;}
#splash #splashAnimation { width: 100% !important;  }
header section.usual #logo {transform:translateX(-20px) translateY(-28px);}
#splash { margin: 0 0 30px 0; height: auto !important; min-height: 600px;}
#splash #splashContent #splashIntro {margin:75px 55px 75px 95px;order: 2;  display: flex;}
#splash #splashGlyphs {order: 1; height:380px; display: flex; position:static; justify-content: center;}
#splash #splashAnimation{  width: 100%;   max-width: unset !important;    height: auto !important;    min-height: 600px; top:0;}
 #splash #splashGlyphs span {  transform: scale(120%); margin: 65px 0 0 0; }
.logoClip {transform: translate3d(95px, 0px, 0px); width: fit-content;}
.advance.logoClip  {transform: translateX(-100%); margin:0 0 0 95px;}
 .slick-cloned, .slider .slideCaption > span{display:none!important;}
 span.advance{display:none;}
 .slider .slideContent { flex: 0 0 100%;     width: 74.5vw !important;}
 .slick-initialized .slick-slide { display: block; width: 40%;  max-width: unset;}
 #portfolio .slick-initialized .slick-slide { display: block; width: 100%;  max-width: unset;}
 #portfolio .chapter .heading {  margin: 0px 45px 100px 95px;}
 .slider .slideCaption img {order: 1;  position: static;   margin: -15px 0 15px 0;   max-width: 80px;}
 .slider .slideCaption h3 {order: 2;  width: 100%;}
 .slider .slideCaption p {order:3;}
 .slider .slideCaption .button {order:4;}
.slider .slideImages img.portrait {  width: 100%;}
.slick-initialized .slick-slide {  display: flex;}
.slider {padding: 0 0 50px 80px;}
.slider .slick-list {width:100%;  margin: 0 0 0 32px !important;}
#splash #splashContent #splashIntro {max-width:50%!important;}
.heading.logoClip h2 {  margin: 0 0 50px 0; max-width: 60%;}
#clients .row > div {  flex: 0 0 100%;}
#clients .row { margin:90px  0 ; flex-wrap:wrap;}
#clients #clientLogos .clientLogos {  position: relative; align-items:center;  min-height:360px;    display: flex;}
#clients #clientLogos .clientLogos li.active {  display: flex;}
#clients #clientLogos .clientLogos li {}
#clients #clientLogos .clientLogos li img{align-self: center;}
#testimonials .testimonials {max-width:unset;}
.triGrid {  padding: 0px 45px 0px 95px;}
#clients { padding: 0 45px 0 95px;}
 footer{margin: 100px 0 0 95px;}
 #testimonials .testimonials {  margin: 0 0 0 35px;}
  .slider .slideCaption img {    margin: -75px 0 15px -45px;    max-width: 150px;     padding: 25px;    background: #fff;}
 .projectFilters, .shopFilters {padding: 0 55px 0 0; height:20px; overflow:hidden; flex-wrap: wrap;   position: relative;  z-index: 200;  -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;} 
 .projectFilters.active, .shopFilters.active {height:380px;}
  .projectFilters .subNav > span, .shopFilters .subNav > span { text-align:right; display: block;   letter-spacing: 7px;  font-weight:normal; text-transform: uppercase;   font-size: 11px;  width: auto;   padding: 0; }
.projectFilters .subNav > span span, .shopFilters .subNav > span span {display:inline;     cursor: pointer;   line-height:18px;}
.projectFilters .subNav > span span:hover, .shopFilters .subNav > span span:hover  {    color: #1d1e22; border-bottom: 1px solid #000;}
.projectFilters .subNav, .shopFilters .subNav {  padding: 0px 0px 0 0;}
.projectFilters .subNav a,.shopFilters .subNav a{   display: inline;  word-wrap: break-word;}
  body.device .notHome #bodyInner {  margin: 70px 0 0 0;}
  #bodyInner.straightIn { padding: 20px 0 0 0;}
  #intro {padding:0px 45px 0px 95px; margin: 80px 0 0 0;}
  .textOnly2Col {padding:60px 45px 60px 115px;}
.grid_imgGrid {padding:0 45px 0 95px;}
#postLoop { padding: 0 45px 0px 141px;}
#postLoop .latestContent { width: 100% !important;}
 #introCaption h1 {font-size:31px;}
 #postLoop .latestCaption p { padding: 0;}
 .propertyTiles { padding: 45px 0 0 141px;}
  .propertyTiles .row div:first-child {flex: 0 0 100%; padding: 0 22px 30px 0;}
 .blog .propertyTile { flex: 0 0 48%;  padding: 0 4px 80px 0;}
 #postLoop .latestCaption p strong.captionOverflow strong {display:inline;}
#postLoop .latestCaption p strong.captionOverflow:after {display:none;}
 
 .propertyTiles .row {  display: flex;  gap: 17px;  flex-wrap: wrap;}
 #postLoop .latestContentInner { display: flex; background: #ffffff;  flex-wrap: wrap;}
 #postLoop .latestImages { flex: 0 0 100%;}
 #postLoop .latestCaption { display: inline;   margin-top: 0px;}
#postLoop .latestCaption h4 {  margin: 0px 0 28px 0;}
 #direct { width: 80%;  margin: 75px 55px 75px 95px !important;}
 .projectFilters{margin: -30px 0 30px 0;}
 .shopFilters{  margin: -16px 0 30px 0px;  z-index: 1000;  padding: 0 13px 0 0;    }
 .projects .projects .propertyTiles .row .propertyTile.portrait { width: 48%!important;  flex: 0 0 48%; padding: 0px 20px 20px 0; padding: 0 35px 80px 0;}
 .subSplash #splash #splashContent { display: flex; align-items: center;  flex-direction: row;}

#direct + #direct { margin: 0!important;}
.newsletter article.showcase .newsletterShowcase {  opacity: 1;  width: calc(100% + 16px);   padding: 0 0 0 65px;  }
.newsletter .newsletterShowcase span.scTrigger {left: 80px;}
.newsletter .newsletterShowcase span.upTrigger {left: 65px;}
.post .passage {  margin: 100px 45px 100px 95px;}
.post .blogFooter { padding: 0px 45px 0px 95px;}
#portfolio .slider .slideContent {width:100%!important; height: auto;}
#portfolio .chapter .var001 p {  max-width: unset;  padding: 0;}
#portfolio .chapter .slider .slideContent {margin: 0 0 100px 0;}
#portfolio .chapter .var003_2 p { margin: 35% 0 0 0;    }
#portfolio .chapter .var003 {  grid-template-rows: repeat(2, 1fr);}
#portfolio .chapter .var004_1 {   grid-area: 1 / 1 / 3 / 4;}
#portfolio .chapter .var004_2 img { transform: unset;}
#portfolio .chapter .var004_3 { grid-area: 1 / 4 / 3 / 3;}
#portfolio .chapter .var004 {grid-template-rows: repeat(2, 1fr);     grid-template-columns: repeat(3, 1fr);}
#portfolio .chapter .var004_3 { display: flex; flex-wrap: wrap;  justify-content: space-between;}
#portfolio .chapter .var005_3 p {flex: 0 0 100%;  width: 100%;}
#portfolio .chapter .var005 { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(1, 1fr);}
#portfolio .chapter .var004_2 {    grid-area: 2 / 1 / 2 / 3;    }
#portfolio .chapter .imageQuote {  left: -60px;    }
#portfolio .devicePair { padding: 0 0 0 95px;}
#portfolio .row .rollerImages {  padding: 50px 50px 50px 0px; transform: unset;}
#portfolio .row.rollerInvert .rollerImages {  padding: 50px 0 50px 50px; transform: unset;}

#portfolio .chapter .mag > div { margin: 0 0 0 98px;}
#portfolio .chapter .mag .magvar001 {display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 0fr);grid-column-gap: 10px; grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar001  .magcell_1 { grid-area: 1 / 1 / 2 / 4; }
#portfolio .chapter .mag .magvar001  .magcell_2 { grid-area: 2 / 1 / 4 / 3; }
#portfolio .chapter .mag .magvar001  .magcell_3 { grid-area: 2 / 3 / 3 / 4; }
#portfolio .chapter .mag .magvar001  .magcell_4 { grid-area: 3 / 3 / 4 / 4; } 
#portfolio .chapter .mag .magvar001 p {padding: 0 25px 0 0; margin:0 0 60px 0; max-width: 75%;}

#portfolio .chapter .mag .magvar002  {display: grid;grid-template-columns: repeat(2, 1fr);grid-template-rows: repeat(2, 0fr);grid-column-gap: 10px;grid-row-gap: 0.9%; }
#portfolio .chapter .mag .magvar002 .magcell_1 { grid-area: 1 / 1 / 2 / 2; }
#portfolio .chapter .mag .magvar002 .magcell_2 { grid-area: 1 / 2 / 3 / 3; display: flex;   align-items: center; }
#portfolio .chapter .mag .magvar002 .magcell_3 {  grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar002 .magcell_3 img {  position: relative;   bottom:0;}
#portfolio .chapter .mag .magvar002 p {padding: 0 25px; max-width: 100%;}

#portfolio .chapter .mag .magvar004 {flex-wrap: wrap; display: flex;}
#portfolio .chapter .mag .magvar004 .magcell_1 {order:1;}
#portfolio .chapter .mag .magvar004 .magcell_2 {order:3; grid-area: 2 / 1 / 2 / 4; }
#portfolio .chapter .mag .magvar004 .magcell_3 {order:2;grid-area: 3 / 2 / 3 / 4; }
#portfolio .chapter .mag .magvar004 .magcell_2 img { flex: 0 0 25%;  width: 25%;  padding: 28px;  left: -25px;  top:25px;}
#portfolio .chapter .mag .magvar004 .magcell_3 {  grid-area: 3 / 1 / 3 / 4; }
#portfolio .chapter .mag .magvar004 .magcell_3 img {max-width: 694px;}

#portfolio .chapter .mag .magvar005 {display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(3, 0fr); grid-column-gap: 10px; grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar005 .magcell_1 { grid-area: 2 / 1 / 4 / 2; display: flex; align-items: end;}
#portfolio .chapter .mag .magvar005 .magcell_2 { grid-area: 2 / 2 / 3 / 3; }
#portfolio .chapter .mag .magvar005 .magcell_3 { grid-area: 3 / 2 / 4 / 3; }
#portfolio .chapter .mag .magvar005 .magcell_4 { grid-area: 1 / 1 / 2 / 3;  display: flex;  justify-content: end;}
#portfolio .chapter .mag .magvar005 .magcell_4 p { columns: 1; column-gap: 75px; max-width:75%; padding:0 0 0 20px; margin:0 0 60px 0;}
#portfolio .chapter .mag .magvar005 .magcell_1 img {object-fit:contain;  position: relative;  top: 10%;}
 .about #portfolio .chapter .mag .magvar005 .magcell_1 img {  object-fit: contain;  position: relative;  top: -5px; }

#portfolio .chapter .mag .magvar006 {  padding: 0 ;}

#portfolio .chapter .mag .magvar008  {display: grid; grid-template-columns: repeat(1, 1fr); grid-template-rows: repeat(3, 0fr); grid-column-gap: 10px; grid-row-gap: 10px; }
#portfolio .chapter .mag .magvar008 .magcell_1 { grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar008 .magcell_2 { grid-area: 3 / 1 / 4 / 2; }
#portfolio .chapter .mag .magvar008 .magcell_3 { grid-area: 1 / 1 / 2 / 2; padding: 0; margin:0 0 60px 0;}
#portfolio .chapter .mag .magvar008 p {max-width:75%;}

#portfolio .chapter .mag .magvar009  {display: grid;grid-template-columns: repeat(2, 1fr);grid-template-rows: repeat(2, 1fr);grid-column-gap: 10px;grid-row-gap: 0.9%; }
#portfolio .chapter .mag .magvar009 .magcell_1 { grid-area: 1 / 1 / 2 / 3; }
#portfolio .chapter .mag .magvar009 .magcell_2 { grid-area: 2 / 2 / 3 / 3; display: flex;   align-items: start; }
#portfolio .chapter .mag .magvar009 .magcell_3 {  grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar009 .magcell_3 img {  position: relative;   bottom:0;}
#portfolio .chapter .mag .magvar009 p {padding: 0 25px; max-width: 100%; margin:60px  0 0 0;}

#portfolio .chapter .mag .magvar013 {display: grid;grid-template-columns: repeat 1fr;grid-template-rows: repeat(1, 1fr); grid-column-gap: 10px; grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar013 .magcell_1{ grid-area: 2 / 1 / 2 / 4; }
#portfolio .chapter .mag .magvar013 .magcell_2{ grid-area: 1 / 1 / 2 / 4; }
#portfolio .chapter .mag .magvar013 .magcell_2 p {padding: 0 0 75px 0px; max-width: 75%;}

#portfolio .chapter .mag .magvar014  {display: grid;grid-template-columns: repeat(2, 1fr);grid-template-rows: repeat(2, 0fr);grid-column-gap: 10px;grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar014 .magcell_1 { grid-area: 1 / 1 / 2 / 3;  display: flex;  flex-wrap: wrap;   align-content:start;}
#portfolio .chapter .mag .magvar014 .magcell_2 {  grid-area:  2 / 1 / 3 / 2; display: flex;  align-items: start;  flex-wrap: wrap;}
#portfolio .chapter .mag .magvar014 .magcell_3 { grid-area: 2 / 2 / 3 / 3; }
#portfolio .chapter .mag .magvar014 p {max-width:unset;}
#portfolio .chapter .mag .magvar014 .magcell_2 img { flex:unset; height: auto;  margin: 0 0 0 65px;  object-fit: unset; width:165px; position: relative;}
#portfolio .chapter .mag .magvar014 p, #portfolio .chapter .mag .magvar004 h3 {padding: 0 25px 0 0;}
#portfolio .chapter .mag .magvar014 .magcell_3 img {position:relative; top:0px;   transform: scale(1.2); transform-origin: top right;}
#portfolio .chapter .mag .magvar014 .magcell_1 p {margin:0 0 75px 0;}
.my-room-outside #portfolio .chapter .mag .magvar014 .magcell_2 img { flex: 0 0 45%;   padding: 0;}


#portfolio .chapter .mag .magvar015  {display: grid;grid-template-columns: repeat(2, 1fr);   grid-template-rows: repeat(2, 0fr);grid-column-gap: 10px;grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar015 .magcell_1 { grid-area: 1 / 1 / 2 / 2;}
#portfolio .chapter .mag .magvar015 .magcell_2 { grid-area: 1 / 2 / 3 / 3;  display: flex;   align-items: center; }
#portfolio .chapter .mag .magvar015 .magcell_3 { grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar015 .magcell_1 img {  position: relative;   bottom: 0;}
#portfolio .chapter .mag .magvar015 p {padding: 0 25px;}

#portfolio .chapter .mag .magvar018 .magcell_1 img { flex: 0 0 19%;}
#portfolio .chapter .mag .magvar018 .magcell_1 {  grid-area: 1 / 1 / 2 / 5;}
#portfolio .chapter .mag .magvar018 .magcell_2 p {  max-width: 75%;   columns: 1;}
#portfolio .chapter .mag .magvar018 .magcell_2 {  grid-area: 2 / 1 / 3 / 5;}


#portfolio .chapter .mag .magvar020  {display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); grid-column-gap: 10px; grid-row-gap: 50px; }
#portfolio .chapter .mag .magvar020 img {max-width: 792px;}
#portfolio .chapter .mag .magvar020 .magcell_1 { grid-area: 1 / 1 / 2 / 3; }
#portfolio .chapter .mag .magvar020 .magcell_2 { grid-area: 2 / 1 / 3 / 3; }
#portfolio .chapter .mag .magvar020 .magcell_3 { grid-area: 1 / 3 / 3 / 4;  display: flex;  align-items: start;}
#portfolio .chapter .mag .magvar020 .magcell_2 img {  position: relative;  left: 0%;}
#portfolio .chapter .mag .magvar020 p {padding: 0 0 0 45px; } 

#portfolio .chapter .mag .magvar021 p {columns:1;         padding: 0 0 0px 0;}

#portfolio .row.roller .rollerText.imgShrink .waypoint img {display:none;}
#portfolio .rollerImages.desktop img { height: 60vh;}
#portfolio .rollerImages.desktop ul { height: 60vh;}
#portfolio .deviceDesktop .row.roller {  margin: 100px 0px 100px 100px;}
#portfolio .devicePhone.special .row.roller {  margin: 100px 0px 100px 100px;}


#portfolio .row.roller .rollerText.imgShrink .waypoint p {  max-width: unset;  padding: 25px;  margin: 140px 0px 0 0px;  position: relative;  background: #f2f2f2;}

#portfolio .chapter.noTestimonial .imageQuote {left:0; width: 100%;}
#portfolio .chapter.noTestimonial.alt {  width: 100%;}
#portfolio .chapter.noTestimonial.alt  .imageQuote > div:first-child {  padding: 0 0 0 115px;   flex: 0 0 60%; }
#portfolio .chapter.noTestimonial.alt .imageQuote .noTestimonial {  width: 100%;}
#portfolio .chapter.noTestimonial.alt .imageQuote {  width: 100%;   }

article#portfolio {   width: calc(100vw - 17px);}

.about .grid_imgGrid .img1 {  grid-area: 2 / 1 / 5 / 5;}
.about .grid_imgGrid {grid-template-rows:repeat(9, 0fr); max-width: unset;}
.about .grid_imgGrid .img1, .about .grid_imgGrid .img2, .about .grid_imgGrid .img3, .about .grid_imgGrid .img4, .about .grid_imgGrid .img5 {transform: unset;}
.about .grid_imgGrid .img1 {  grid-area: 1 / 1 / 2 / 5;}
.about .grid_imgGrid .img2 {  grid-area: 6 / 1 / 7 / 3;} 
.about .grid_imgGrid .img5 {  grid-area: 4 / 3 / 4 / 5}
.about .grid_imgGrid .img6 {  grid-area: 5 / 1 / 6 / 5;}
.about .grid_imgGrid .img4 { grid-area: 4 / 1 / 10 / 3; }
.slideContent.finalSlide > div {height: 65vh;}

.blog .sendbutton {  padding: 0 48px 0 141px;}
#portfolio .chapter.headReduce .heading {  margin: 0px 45px -30px 95px;}

#spotlight {  padding: 0 35px 0 95px;}

.simpleBody {padding: 80px 45px 200px 95px; }
.simpleBody > div p { flex:0 0 30%;}
.simpleBody > div {	gap: 5%;}


.shoppages #productFeed {   padding: 0 0 50px 140px; gap: 30px;}
.shoppages #productFeed .product {  flex: 0 0 43%;}
.shop #cartIcon, .store #cartIcon, .shoppages #cartIcon {position: fixed;  top: 83px;  right: 16px;}
.shoppages .itemDetails > span {top: 3px;  left: 136px;}
.shoppages .itemDetails {padding: 80px 0 0 0;}
.shoppages .itemDetails > section {  flex: 0 0 80%; }
.shoppages:not(.shopcat) .itemDetails > section	{order:2}
.shoppages .itemDetails > section#productPhotography { padding: 0 0 60px 140px;  order: 1;}
 .shopFilters.active {   height: 380px;    z-index: 1000;    background: #f2f2f2;}
article.showcase .shoppages .checkoutShowcase {   opacity: 1;    width: calc(100% + 20px);  }
.shoppages .checkoutShowcase span.scTrigger {top:64px;}
 
 .blog #blogfilter { padding: 0 45px 0px 141px;  margin: 80px 0 0 0;}
 .blog #blogfilter .random {margin: 0 -8px 0 0;}
 .blog #blogfilter > div > div.mostread {padding: 25px 0px 25px 17px;}
 .blog #blogfilter .archive ul { padding: 0px 0px 0 0;	margin: 0 -3px 0 0;}
 .blog #blogfilter .archive li:not(:first-child) {	padding: 0 0px 0 19px;}
 .blog #blogfilter .archive li.year {  padding: 15px 0px 15px 19px !important; 	margin: 0 -3px 0 0;}
 
#dbanner {margin: 110px 0 0 95px; max-width: 80%;}
#dbanner .Art {  max-width: 100%;}
 }
 
 
@media (max-width: 980px) { 
#portfolio .chapter .mag .magvar022 .magcell_1 { grid-area: 1 / 1 / 2 / 4;;}
#portfolio .chapter .mag .magvar022 .magcell_2 {  grid-area: 3 / 2 / 3 / 4;text-align: right;}

#portfolio .chapter .mag .magvar022 .magcell_3 { margin:0;  grid-area: 2 / 1 / 3 / 4;   }
#portfolio .chapter .mag .magvar022 .magcell_3 p {max-width:unset;}
#portfolio .chapter .mag .magvar022 .magcell_3 div {  columns: 1;  gap: 45px;  flex: 0 0 100%;}
#portfolio .chapter .mag .magvar022 {  grid-template-rows: repeat(2, 0fr);}
}


 @media (max-width: 900px) { 
 .triGrid .subNav ul.action li, .triGrid .row.substitute1 > div ul.core li {  flex: 0 0 100%; }
 #portfolio .chapter .imageQuote .shortTestimonial p {  font-size: 22px;   line-height: 28px;}
 #portfolio .chapter .mag .magvar019 .magcell_1 img:last-child { position: absolute;  top: 74%;  left: -21.5%;  width: 57.77%;}
  .simpleBody > div {  display: inline-block; }
  .simpleBody > div p {	padding: 0 0 20px 45px;}
 }
  
@media (max-width: 880px) { 

footer .smallprint {display:inline;}  
footer .smallprint p { margin: 30px 0 0 0;  padding: 0 0 7px 0px;    line-height: 17px;}
footer #subFooter {padding: 20px 10px 0px 30px;}
footer .smallprint svg {  margin: 13px 25px 0 -34px;}
footer #subFooter > div:nth-child(2) {  margin: 0 0 0 0px;    padding: 0 0 0 00%;    }
footer #subFooter > div {  flex-basis: 33% !important;}
footer .subNav ul.action {padding: 0 0 0 0px;}
footer .subNav > span, footer .subNav ul.social{padding:0;}
#intro >div:first-child {  flex: 0 0 100%;}
#intro >div:last-child { position: relative; flex: 0 0 100%; max-width: unset; text-align: right;   display: flex;  justify-content: end; }
#intro >div:last-child span {display: block;   height: 100%;  position: absolute;  left: 0; top: 0;  width: 90%; background-image: linear-gradient(90deg, #dedede 11.11%, #f2f2f2 11.11%, #f2f2f2 50%, #dedede 50%, #dedede 61.11%, #f2f2f2 61.11%, #f2f2f2 100%);background-size: 18.00px 18.00px;clip-path: polygon(0 0, 100% 100%, 100% 0);} 
.textOnly2Col > div {  flex: 0 0 100%; }
.textOnly2Col {  flex-wrap: wrap; padding: 60px 45px 60px 95px; }
.grid_imgGrid{padding: 0 45px 0 0px; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(9, 1fr); grid-column-gap: 25px; grid-row-gap: 25px;   max-width: unset;  margin: 0 0 130px 95px;}
.about .grid_imgGrid { margin: 0 0 0px 95px;}
.grid_imgGrid .img1 { grid-area: 1 / 1 / 5 / 5; }
.grid_imgGrid .img2 { grid-area: 6 / 1 / 8 / 3; transform: translate3d(0, -5px, 0px);}
.grid_imgGrid .img3 { grid-area: 6 / 3 / 8 / 5; transform: translate3d(0, -5px, 0px);}
.grid_imgGrid .img4 { grid-area: 8 / 1 / 10 / 3; transform: translate3d(0, -5px, 0px);}
.grid_imgGrid .img5 { grid-area: 8 / 3 / 10 / 5;  transform: translate3d(0, -5px, 0px);}
.grid_imgGrid .img6 { grid-area: 5 / 1 / 6 / 5; }
.post #intro .blogsocial { order: 2; border: 0;}
.post #intro #introCaption { order: 2;}
.post #intro { margin: 40px 0 0 0;}
.newsletterMail .deviceWidth {width:100%!important;padding:0;max-width:100%!important; }
.newsletterMail .center {text-align:center!important;}
.newsletterMail .column {width:100%!important; max-width:100%!important; display:initial!important;}
.newsletterMail .depad {padding: 5px !important; text-align:center!important; width:590px!important;}
.newsletterMail .depad table {display:inline-block!important; margin: 0 auto!important; width:278px!important;}
.newsletterMail .depad table td { width:590px!important;}
.newsletterMail .logo {display:block!important;}
.newsletterMail .deviceWidth {width:100%!important;}
.newsletterMail .killit {height:0px!important;padding:0;}
.newsletterMail .mobsmall {font-size:20px;}
.newsletterMail .mobsmaller {font-size:14px;}
.newsletterMail .rightSide.buttonholder {padding:0 197px 23px 21px !important;}
.newsletterMail .deemphasise {height:90px!important;text-align: center!important;padding:17px 3px !important;}
.newsletterMail .breathe {padding: 15px 15px 0!important;}
.newsletterMail .breathe.last {padding: 15px 15px 25px!important;}
.newsletterMail .rightSide.buttonholder { padding: 0px 76px 22px 99px !important;}
.newsletterMail img.deviceWidth {max-width: 475px !important;}
.newsletterMail .widen{padding:50px 20px!important;}
.newsletterMail .quotewiden {padding:10px 20px!important;}
.newsletterMail .trough {padding:50px 0 0 0!important;}
.post .passage {  flex-wrap: wrap; width:100%;padding: 60px 45px 60px 95px; margin: 0;}
.post .passage > div:first-child {width:100%; padding:0; justify-content: center; /*order: 2;*/}
.post .passage > div { width: 100%;}
.post .passage > div img {  width: 100%;   margin: 0 0 40px 0;}
#portfolio #introCaption{min-height: 430px;}

#portfolio .deviceDesktop .row.roller .rollerText {margin-left: -220px;}
#portfolio .deviceDesktop .row.roller .rollerText .waypoint p {padding:25px;}

#portfolio .deviceDesktop .row.roller .rollerText .waypoint p { padding: 25px 25px 50px 25px;  background: #f2f2f2;   z-index: 800;   border-top: 1px solid #1d1e22;   clip-path: polygon(100% 0, 100% 0%, 100% 100%, 15% 100%, 0% 85%, 0% 0%);}
#portfolio .devicePhone.special .row.roller .rollerText .waypoint p { padding: 25px 25px 50px 25px;  background: #f2f2f2;   z-index: 800;   border-top: 1px solid #1d1e22;   clip-path: polygon(100% 0, 100% 0%, 100% 100%, 15% 100%, 0% 85%, 0% 0%); max-width: 420px;}

#portfolio .devicePhone.special .row.roller .rollerText {margin-left: -430px;   min-width: 70%;}
#portfolio .devicePhone.special .roller > div {  min-width: 85%;}
#portfolio .devicePhone.special .row.roller .rollerText .waypoint { padding: 0 0px 0 0;}
#portfolio .devicePhone.special .row.roller .rollerText .waypoint p {  margin: 140px -162px 0 0;}


#portfolio .chapter .mag .magvar012 {display: grid; grid-template-columns: 1fr; grid-template-rows: repeat(4, 0fr);  grid-column-gap: 10px; grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar012 .magcell_1 { grid-area:  2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar012 .magcell_2 { grid-area: 3 / 1 / 4 / 2; text-align:center; margin:60px 0 0 0 ;}
#portfolio .chapter .mag .magvar012 .magcell_3 { grid-area:  4 / 1 / 5 / 2; }
#portfolio .chapter .mag .magvar012 .magcell_4 { grid-area:  1 / 1 / 2 / 2;  display: flex;  justify-content: end;}
#portfolio .chapter .mag .magvar012 .magcell_4 p { columns: 1; column-gap: 75px; max-width:unset; padding: 0px 0 60px 0px;}
#portfolio .chapter .mag .magvar012 .magcell_1 img { width: 100%;}
#portfolio .chapter .mag .magvar012 .magcell_2 img	{max-width: 360px;}

#portfolio .chapter .mag .magvar014 { display: grid;  grid-template-columns: repeat(2, 1fr);  grid-template-rows: repeat(2, 0fr);  grid-column-gap: 10px;  grid-row-gap: 0.9%; }
#portfolio .chapter .mag .magvar014 .magcell_2 {  grid-area: 1 / 1 / 2 / 3;   display: flex;   align-items: start;   flex-wrap: wrap; justify-content: space-between; column-gap: 2%;}
#portfolio .chapter .mag .magvar014 .magcell_3 { grid-area: 3 / 1 / 3 / 3;  }
#portfolio .chapter .mag .magvar014 .magcell_3 img { position: static; transform: unset;}
#portfolio .chapter .mag .magvar014 .magcell_1 {  grid-area:2 / 1 / 2 / 3; margin: 0;}
#portfolio .chapter .mag .magvar014 .magcell_2 img {margin: 0; left:0; width:183px;}
#portfolio .textOnly2Col {  padding: 60px 45px 60px 140px;  column:1; gap:0; }
#portfolio .textOnly2Col div { columns:1; gap:0; flex:0 0 100%;}
.my-room-outside #portfolio .chapter .mag .magvar014 .magcell_2 img {  left: -20px; flex: 0 0 24%;}
.wrap-it-up #portfolio .chapter .mag .magvar014 .magcell_2 img { left: 0px;}

.about .grid_imgGrid {padding:0 45px 0 95px;}

.slideContent.finalSlide > div > div {background: #ffffff;z-index: 800;	max-width: 390px;	padding: 55px;	margin: 0 0 0 30px;}

#spotlight {flex-wrap:wrap;}
#spotlight > div:last-child {flex: 0 0 100%; order:3; padding: 60px 50px 0px 50px;}
  #spotlight > div:first-child {  order:2; flex: 0 0 75%; max-width: 460px;}
   #spotlight > div:first-child img { max-width: unset;   width: 100%;  }
#spotlight > div:nth-child(2) {order:1;}
#spotlight .spotlightLogo {  bottom: -50px;  right: 0px; z-index: 80;}
 #spotlight > div:nth-child(2) h2 {   bottom: 180px;  }
  #spotlight > div:first-child > span {    width: 70%;    transform: unset;    right: unset;    left: 0;  }
    
}
  
@media (max-width: 800px) { 
.slideContent.finalSlide > div { background-image: none; height: auto;}
.slideContent.finalSlide > div > div {  background: transparent;   max-width: unset;    padding: 0;    margin: 0; }
.slideContent.finalSlide > div:before, .slideContent.finalSlide > div:after,   .slideContent.finalSlide:before {display:none;}
.home .slick-track .slick-slide[data-slick-index="6"] div div {  width: 100% !important;  }

#splash #splashContent #splashIntro {  max-width: 100% !important; }
.slick-initialized .slick-slide {width:100%;}
.slider .slideImages img.portrait {  max-height: unset;}
.slider .slideContent {  width: auto !important;  display: inline-block !important;}
.slick-initialized .slick-slide { margin: 0px 85px 0px 29px; max-width:400px;}
.slider .slideCaption {  margin: 0 0 75px 0;  background: #fff;}
.triGrid .row > div {  flex: 0 0 100%;  }
.triGrid .row {flex-wrap:wrap;}
.triGrid .row > div:first-child, .triGrid .row.alt > div:nth-child(2n) { padding: 80px 0;  order: 2;   margin: 0 0 70px 0;}
#clients #clientLogos .clientLogos li img {  max-width: 90px;}
#clients #clientLogos .clientLogos {min-height:250px;}
#splash #splashContent #splashIntro { margin: 25px 35px 75px 0px;}
#splash #splashGlyphs span { margin: 0px 0 0 0;}
.blog .propertyTile { flex: 0 0 100%;  padding: 0 22px 80px 0;}


.subSplash #splash #splashContent {  display: flex;  align-items: unset;  flex-direction: unset; padding: 75px 55px 75px 95px !important;}
.projects .projects .propertyTiles .row .propertyTile.portrait {  width: 100%!important;  flex: 0 0 100%;  padding: 0 35px 10px 0;}
.projects .projects .propertyTiles .row .propertyTile.landscape {padding: 0 45px 30px 0;}
#direct {margin:0px 29px 75px 29px!important;  width: 100%;}
.project-close #direct .newsletterOnboard > div:last-child, .project-close #direct .newsletterOnboard > div:first-child { min-height: 140px;}
.project-close #direct .newsletterOnboard { margin:130px 0 40px -12px;}

 .newsletter .newsletterOnboard > div:last-child, .newsletter .newsletterOnboard > div:first-child { min-height: 140px;}
 .newsletter .newsletterOnboard  { margin:130px 0 40px -12px;}
 
#testimonials .testimonials li.shortTestimonial p {  font-size: 19px; }
#portfolio .chapter { margin: 60px 0;}
#portfolio .chapter .var001, #portfolio .chapter .var002, #portfolio .chapter .var003, #portfolio .chapter .var004, #portfolio .chapter .var005 { display: block !important;  width: 100%;}
#portfolio .chapter .slider .slideContent {height:auto; padding: 0 0 0 35px;}
#portfolio .chapter .var002_1 img {max-width:unset;}
#portfolio #introCaption { min-height: 390px;}
#portfolio .chapter .var001_2, #portfolio .chapter .var002_2, #portfolio .chapter .var003_2 { margin: 30px 0;}
#portfolio .slick-initialized .slick-slide { margin: 0px 45px 0px 29px;}
#portfolio .chapter .slider .slideContent, #portfolio .chapter .heading h2 {  margin: 0 0 50px 0; }
#portfolio .chapter .var002_2 p, #portfolio .chapter .var004_1 p {padding: 0; max-width:unset; margin: 0 0 50px 0;}
#portfolio .chapter .var006_2 p {padding: 0; max-width:unset; margin: 50px 0;}
#portfolio .chapter .var003_1 div:first-child {  transform: rotate(-45deg) scale(0.8) translate(6%, 20%);}
#portfolio .chapter .var003_1 div:last-child {  transform: rotate(45deg) scale(0.7) translate(-33%, 26%);}
#portfolio .chapter .var003_2 p { columns: 1;  margin: 0;}
#portfolio .chapter .var004_2 img { transform: translate(0%, 0px);}
#portfolio .chapter .var005_1, #portfolio .chapter .var005_2, #portfolio .chapter .var005_3, #portfolio .chapter .var004_3 { display: flex; flex-wrap:wrap; justify-content: space-between;}
#portfolio .chapter .var004_3 { margin: 50px 0 0 0;}
#portfolio .chapter .var005_3 p {  flex: 0 0 100%;   width: 100%;} 
#portfolio .chapter .var005_1, #portfolio .chapter .var005_2, #portfolio .chapter .var005_3	{max-width: 500px;   margin: 0 auto;}
#portfolio .chapter .var004_3	{max-width: 500px;   margin: 50px auto 0 auto;}
#portfolio .chapter .imageQuote { display: block; align-items: center;   padding: 0 0 0 0px;  position: relative;  left: 0;  z-index: 500;  top: 0;}
#portfolio .chapter .imageQuote > div {  width: 100%;}
#portfolio .chapter .imageQuote >div:last-child {  margin: 50px 0 0 80px;    max-width: 80%;   }
#portfolio .chapter .var006 { width:100%; display:block!important;}
#portfolio .chapter .var006_2 img { max-width: 50%;  margin: 25px 0;  transform: unset; }
#portfolio .chapter .var006_2 img:last-child {transform: translate(100%, 0);}

#portfolio .chapter .mag {margin:0 0 90px 0;}
#portfolio .chapter .mag .magvar001 {display: grid; grid-template-columns: repeat(1, 1fr); grid-template-rows: repeat(4, 0fr);grid-column-gap: 10px; grid-row-gap: 0.9%; margin: 0 0 0 98px;}
#portfolio .chapter .mag .magvar001  .magcell_1 { grid-area: 1 / 1 / 2 / 2; }
#portfolio .chapter .mag .magvar001  .magcell_2 { grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar001  .magcell_3 { grid-area: 3 / 1 / 4 / 2; }
#portfolio .chapter .mag .magvar001  .magcell_4 { grid-area:  4 / 1 / 5 / 2; } 
#portfolio .chapter .mag .magvar001 p {padding: 0 25px 0 0; margin:0 0 60px 0; max-width: unset;}
#portfolio .chapter .mag .magvar013 .magcell_2 p { max-width: unset;}

#portfolio .chapter .mag .magvar002  {display: grid;grid-template-columns: repeat(1, 1fr);grid-template-rows: repeat(1, 1fr);grid-column-gap: 10px;grid-row-gap: 0.9%; }
#portfolio .chapter .mag .magvar002  .magcell_1 { grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar002  .magcell_2 { grid-area: 1 / 1 / 2 / 2; }
#portfolio .chapter .mag .magvar002  .magcell_3 { grid-area: 3 / 1 / 4 / 2; }
#portfolio .chapter .mag .magvar002 .magcell_3 img {  position: relative;   bottom:0;}
#portfolio .chapter .mag .magvar002 p {padding: 0px; max-width:unset; margin:0 0 60px 0;}

#portfolio .chapter .mag .magvar003 {display: grid!important;  grid-template-columns: repeat(1, 1fr);  grid-template-rows: repeat(1, 1fr);grid-column-gap: 25px;grid-row-gap: 25px;}
#portfolio .chapter .mag .magvar003 .magcell_1 {   grid-area: 2 / 1 / 2 / 3;}
#portfolio .chapter .mag .magvar003 .magcell_2 {   grid-area: 1 / 1 / 1 / 1;}
#portfolio .chapter .mag .magvar003 .magcell_2 p { columns: 1; column-gap: 75px; max-width:unset;}
#portfolio .chapter .mag .magvar003 .magcell_1 div:first-child { transform: rotate(-45deg) scale(0.8) translate(-7%, 28%);}
#portfolio .chapter .mag .magvar003 .magcell_1 div:last-child { transform:rotate(45deg) scale(0.8) translate(-2%, 36%); height: auto;}

#portfolio .chapter .mag .magvar004 .magcell_1 p { max-width: unset; }
#portfolio .chapter .mag .magvar004 .magcell_2 img {  flex: 0 0 33%;}

#portfolio .chapter .mag .magvar005 {grid-template-columns: repeat(1, 1fr);}
#portfolio .chapter .mag .magvar005 .magcell_1 img {top: 0;}
#portfolio .chapter .mag .magvar005 .magcell_4 p { columns: 1;  column-gap: 75px;   max-width: unset;    padding: 0;   margin: 0 0 60px 0;}
#portfolio .chapter .mag .magvar005 .magcell_1 {   grid-area: 2 / 1 / 3 / 2;}
#portfolio .chapter .mag .magvar005 .magcell_2 {   grid-area: 3 / 1 / 4 / 2;}
#portfolio .chapter .mag .magvar005 .magcell_3 {   grid-area: 4 / 1 / 5 / 2;}

#portfolio .chapter .mag .magvar006 { grid-template-columns:  1fr; grid-template-rows: repeat(4, 1fr);}
#portfolio .chapter .mag .magvar006 .magcell_1 { grid-area: 1 / 1 / 2 / 2; }
#portfolio .chapter .mag .magvar006 .magcell_2 { grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar006 .magcell_3 { grid-area: 3 / 1 / 4 / 2; }
#portfolio .chapter .mag .magvar006 .magcell_4 { grid-area: 4 / 1 / 5 / 2; }
#portfolio .chapter .mag .magvar006 .magcell_3 p {padding: 0 25px;}

#portfolio .chapter .mag .magvar009  {display: grid;grid-template-columns: repeat(1, 1fr);  grid-template-rows: repeat(3, 0fr);grid-column-gap: 10px;grid-row-gap: 0.9%; }
#portfolio .chapter .mag .magvar009 .magcell_1 { grid-area:  2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar009 .magcell_2 { grid-area: 3 / 1 / 4 / 2; display: flex;   align-items: start; }
#portfolio .chapter .mag .magvar009 .magcell_3 {  grid-area: 1 / 1 / 2 / 2; }
#portfolio .chapter .mag .magvar009 .magcell_3 img {  position: relative;   bottom:0;}
#portfolio .chapter .mag .magvar009 p {padding: 0px; max-width: 100%; margin:60px  0 0 0;}

#portfolio .chapter .mag .magvar015  {display: grid;grid-template-columns: repeat(1, 1fr);grid-template-rows: repeat(1, 1fr);grid-column-gap: 10px;grid-row-gap: 0.9%; }
#portfolio .chapter .mag .magvar015  .magcell_1 { grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar015  .magcell_2 { grid-area: 1 / 1 / 2 / 2; }
#portfolio .chapter .mag .magvar015  .magcell_3 { grid-area: 3 / 1 / 4 / 2; }
#portfolio .chapter .mag .magvar015 .magcell_1 img {  position: relative;   bottom: 0;}
#portfolio .chapter .mag .magvar015 p {padding: 0px;   max-width: unset;   margin: 0 0 60px 0;}

#portfolio .chapter .mag .magvar016 {display: grid; grid-template-columns:repeat(2, 1fr); grid-template-rows: repeat(3, 0fr); grid-column-gap: 10px; grid-row-gap: 0.9%;}
#portfolio .chapter .mag .magvar016 .magcell_1 { grid-area: 1 / 1 / 1 / 3; }
#portfolio .chapter .mag .magvar016 .magcell_2 { grid-area: 2 / 1 / 2 / 3; }
#portfolio .chapter .mag .magvar016 .magcell_3 { grid-area: 3 / 1 / 3 / 3; }
#portfolio .chapter .mag .magvar016 .magcell_4 { grid-area:  5 / 1 / 5 / 3;  display: flex;  justify-content: end;}
#portfolio .chapter .mag .magvar016 .magcell_5 {grid-area: 4 / 1 / 4 / 3; }
#portfolio .chapter .mag .magvar016 .magcell_4 p { columns: 1; column-gap: 75px; max-width:unset; padding: 75px 0 0 0px;}

#portfolio .chapter .mag .magvar018 .magcell_1 {margin:75px  0 0 0;gap: 19px;}

#portfolio .chapter .mag .magvar020  {display: grid; grid-template-columns: repeat 1fr; grid-template-rows: repeat(3, 0fr); grid-column-gap: 10px; grid-row-gap: 50px; }
#portfolio .chapter .mag .magvar020 img {max-width: 792px;}
#portfolio .chapter .mag .magvar020 .magcell_1 { grid-area: 2 / 1 / 3 / 3; }
#portfolio .chapter .mag .magvar020 .magcell_2 { grid-area: 3 / 1 / 4 / 3; }
#portfolio .chapter .mag .magvar020 .magcell_3 { grid-area: 1 / 1 / 2 / 3;  display: flex;  align-items: start;}
#portfolio .chapter .mag .magvar020 p {padding: 75px 0 0 0; max-width:unset;}

#portfolio .chapter .mag .magvar022 .magcell_2 {    grid-area: 3 / 1 / 3 / 4;}

#portfolio .deviceDesktop .row.roller .rollerText .waypoint p{ margin: 0px 0px 0 0px;}
#portfolio .deviceDesktop .row.roller .rollerText {margin-left: -430px;}

#portfolio .rollerImages.desktop img,  #portfolio .rollerImages.desktop ul {height: 530px;}

#portfolio .chapter.noTestimonial .imageQuote { width: 90vw;}
#portfolio .chapter.noTestimonial .imageQuote > div:first-child {padding:0;}
#portfolio .chapter.noTestimonial .imageQuote > div:first-child img {  margin: 45px auto 0 auto;  max-width:75%;    }
#portfolio .chapter.noTestimonial .imageQuote .noTestimonial {  padding: 0 5%; }
#portfolio .row.roller .rollerText .waypoint {max-width:380px;}

#portfolio .chapter.noTestimonial.alt .imageQuote > div:first-child {  padding: 0 0 0 145px;   flex: 0 0 100%;    }
#portfolio .chapter.noTestimonial.alt .imageQuote { display: inline;}
#portfolio .chapter.noTestimonial.alt .imageQuote > div:first-child img {  max-width: 100%;}
#portfolio .chapter.noTestimonial.alt .imageQuote .noTestimonial { padding: 0 5% 0 80px;  }

#portfolio .chapter.noTestimonial .imageQuote .noTestimonial p {  margin: 35px 0;  }

.fragrances-of-the-world .specialWrapper #card3 #wheelHolder {bottom:-950px}
.fragrances-of-the-world .specialWrapper #card3 #familyName_1, .fragrances-of-the-world .specialWrapper #card3 #familyName_2, .fragrances-of-the-world .specialWrapper #card3 #familyName_3 {font-size:15px;}

}
 
 @media (max-width: 755px) { 
#intro >div:first-child {order:2;}
#intro >div:last-child {order:1;}
#portfolio .rollerImages.phone ul { overflow:hidden; height:479px;     z-index: 15;}
#portfolio .rollerImages.phone img{ height:479px; padding:10px !important;}
#portfolio .rollerImages.phone > div:before {left: -10px;  top: 9px;}
#portfolio .rollerInvert .rollerImages.phone > div:after {left: -10px;  bottom: 27px;}
#portfolio .row.rollerInvert .rollerImages {  padding: 50px 0 50px 0px; }
#portfolio .row.roller .rollerText .waypoint {  margin: 400px 0; }
#portfolio .row.roller .rollerText .waypoint p {padding:0 50px 0 22px;}
#portfolio .row.roller.rollerInvert .rollerText .waypoint p {padding:0 0 0 50px;}
#portfolio .row.roller .rollerText .waypoint { padding: 0 0 0 25px}
#portfolio .row.rollerInvert .rollerImages { padding: 50px 0 50px 40px;  }
#portfolio .row.roller.rollerInvert .rollerText .waypoint p {  padding: 0 25px; }
#portfolio .chapter .mag .magvar007 {display: grid!important; grid-template-columns: repeat(1, 1fr); grid-template-rows: repeat(4, 0fr); grid-column-gap: 25px; grid-row-gap: 25px;}
#portfolio .chapter .mag .magvar007 .magcell_1 { grid-area: 2 / 1 / 3 / 2; }
#portfolio .chapter .mag .magvar007 .magcell_2 { grid-area: 3 / 1 / 4 / 2; }
#portfolio .chapter .mag .magvar007 .magcell_3 { grid-area: 4 / 1 / 5 / 2; }
#portfolio .chapter .mag .magvar007 .magcell_4 { grid-area: 1 / 1 / 2 / 2; }
#portfolio .chapter .mag .magvar007 img { max-width: 360px;}
#portfolio .chapter .mag .magvar007 .magcell_4 p { max-width:unset;text-align:left; }
#portfolio .chapter .mag .magvar007 > div { display:inline; align-items: center; text-align: center;}
#portfolio .rollerImages.phone > div, #portfolio .rollerImages.desktop > div, #portfolio .devicePair .col.staticPhone div:first-child, #portfolio .devicePair .col.staticDesktop div:first-child { padding: 17px 0px 35px 0;}
#portfolio .rollerImages.desktop > div { padding: 5px 0px 10px 0;}
#portfolio .row .rollerImages.desktop { padding: 70px 10px 70px 10px; }
#portfolio .row.roller.wide .rollerImages.mainimgShrink img{padding: 10px 10px 10px 6px !important;}
#portfolio .row .rollerImages.desktop > div:before {width:107%;}
#portfolio .chapter.noTestimonial.alt .imageQuote > div:first-child img {padding: 0 0 0 145px;}
#portfolio .chapter.noTestimonial.alt .imageQuote > div:first-child {  padding: 0 0 0 0px;}
#portfolio .chapter.noTestimonial.alt .imageQuote .noTestimonial p {  margin: 35px 0;  }
#portfolio .chapter.noTestimonial.alt .imageQuote:first-child .noTestimonial p {  margin: 0 0 35px 0  }
#portfolio .chapter .mag .magvar014 .magcell_2 img { margin: 0;  left: 0;    width: 123px; }
.simpleBody > div p {	max-width: 420px;}
.simpleBody {	padding: 80px 45px 70px 95px;}
.shoppages .checkout-form-group {display:block;margin-top: 20px;}
.shoppages .inputText { margin-top: 10px; font-size:15px}
 .about .grid_imgGrid .img6 p, .about .grid_imgGrid .img7 p {font-size: 26px;}
  .fragrances-of-the-world .specialWrapper #card3 #familyName_1, .fragrances-of-the-world .specialWrapper #card3 #familyName_2, .fragrances-of-the-world .specialWrapper #card3 #familyName_3 {font-size: 20px; color: #000; max-width: 110px; padding: 120px 0 0 0; text-shadow: unset;  margin: 0 0 0 -55px;}
}

@media (max-width: 700px) { 
  #dbanner { flex-wrap: nowrap;  margin: 110px 0 0 95px;  display: flex;  max-width: unset;  width: auto;  flex-direction: column;}
#dbanner div {flex: 0 0 100%;}
#dbanner div:last-child	{order: 1;}
#dbanner div:first-child { order: 2;}
#dbanner .Art {   max-width: 70%;  }
#dbanner div img {position:relative;}
#dbanner  div:last-child img {left: -25px;}
#dbanner .heading { margin: -10px 0 0 0;}
}
  
@media (max-width: 630px) { 
.fourohfour .core, .fourohfour .action {  padding: 0 0 0 3px!important;}
.fourohfour  #direct .subNav ul li a { display: inline;  font-size: 11px;  }
.fourohfour #direct ul {  margin: 0 20px 0 30px;}
#portfolio .chapter .slider .slideContent {padding:0;}
#portfolio .slick-initialized .slick-slide {  margin: 0px 0px 0px 0px;    }
#portfolio .chapter .slider {padding:0 10px;}
#portfolio .chapter .slider .slideContentInner {max-width:100%;}
.propertyTiles {  padding: 45px 35px 0 35px; }
#portfolio .chapter .imageQuote >div:last-child {   margin: 50px 0 0 0px;}
.propertyTiles .row div:first-child, .blog .propertyTile {   padding: 0 0px 30px 0;}
body.device .notHome #bodyInner {   margin: 20px 0 0 0; }    
#postLoop {  padding:0 35px 0px 35px;}
#postLoop .latestCaption {   padding: 25px 25px;}
#splash #splashGlyphs span {transform:scale(100%)!important;}
#splash #splashContent #splashIntro {  margin: 25px 10px 0px 10px;}
header section.usual #logo { transform:translateX(-27px) translateY(-37px);   max-width: 62px;}
header section.usual #logo svg { width: 100%; max-width: 140px;}
.triGrid {padding: 0px 10px 0px 10px;}
.logoClip {  transform: translate3d(65px, 0px, 0px);         transform: unset;}
.blog .heading.logoClip { margin:25px 35px 0px 10px;  padding: 0 0 0 25px;}
.heading.logoClip { margin:25px 10px 0px 10px;  padding: 0 0 0 25px;}
header nav > span { padding: 3px;  width: 21px;  top: 10px;  right: 19px;}
#splash #splashGlyphs span {  transform: scale(80%);  margin: -15px 0 0 0;}
#splash #splashAnimation {min-height:460px;}
#splash #splashGlyphs {  height: 290px;}
.slider .slick-list {margin:0!important;}
.slick-initialized .slick-slide {max-width:unset;   margin: 0px 29px;  }
.button {font-size:12px; height: 44px;  line-height: 45px;}
.triGrid .row > div:first-child, .triGrid .row.alt > div:nth-child(2n) {  padding: 40px 0;  }
#clients {  padding: 0 10px 0 10px;}
footer { margin: 100px 0 0 0px;}
.slider .slideCaption h3 {   margin: 0 0 20px 0;    font-size: 25px;}
.slider .slideCaption img {max-width:125px;}
#intro {padding: 0px 29px 0px 29px;  margin: 60px 0 0 0; }
.textOnly2Col { padding:40px 25px 60px 25px; }
.grid_imgGrid {margin:0 0 130px 10px;}
.grid_imgGrid .img3 {  grid-area: 4 / 1 / 3 / 5; }
.grid_imgGrid .img2 {grid-area: 2 / 1 / 8 / 5;}
.grid_imgGrid .img4 {   grid-area:4 / 1 / 10 / 5;}
.grid_imgGrid .img5 { grid-area:6 / 1 / 10 / 5;}
.grid_imgGrid {grid-template-rows: repeat(5, 1fr);}
.formButtons {  flex-wrap: wrap;}
.recaptcha { padding: 2% 0 2% 0px; display: inline-block; width: 100%;}
.recaptcha small {  max-width: 200px;  margin: 8px 11px 8px 40px;  font-size: 15px;   position: relative;   display: block;}
.recaptcha small:before {transform: rotate(90deg);}
.projects .projects .propertyTiles  { padding: 45px 0 0 35px;    }
#direct a, #direct p { word-wrap: break-word;}
#direct {width: 100%;}
.subSplash #splash #splashContent {  padding: 75px 10px 75px 10px !important;}
.directInner {  padding: 25px 10px 25px 10px;}
.inputText { position: static; padding: 9px 7px 11px 0px;}
.project-close #direct .inputText { padding: 3px 7px 0px 0px;}
.project-close #direct .newsletterOnboard > div:last-child {  margin: 0 0 0 -77px;   order:1; transform: scale(0.7) translate(-27px, 0px);    }
.project-close #direct .newsletterOnboard > div:first-child {order:2;}
.project-close #direct .newsletterOnboard {  margin: 70px 0 40px 0px;   }
.project-close #direct .newsletterOnboard > div:last-child img { padding: 0 0 0 42px;}
.project-close #direct .newsletterOnboard > div:first-child em {margin: 0 0 22px -13px;}

.newsletter .newsletterOnboard > div:last-child {  margin: 0 0 0 -77px;   order:1; transform: scale(0.7) translate(-27px, 0px);    }
.newsletter .newsletterOnboard > div:first-child {order:2;}
.newsletter .newsletterOnboard {  margin: 70px 0 40px 0px;   }
.newsletter .newsletterOnboard > div:last-child img { padding: 0 0 0 42px;}
.newsletter .newsletterOnboard > div:first-child em {margin: 0 0 22px -13px;}


.newsletter article.showcase .newsletterShowcase {padding:0 0 0 0;}
.newsletter .newsletterShowcase span.upTrigger { left: 12px; }
.newsletter .newsletterShowcase span.scTrigger { left: -4px;  }
.newsletter .emailNav ul li span { display: none;}
.newsletter .returnsuccess {  margin: 0 0 14px 35px;}
.newsletter .whatnext h2 {margin: 50px 0 21px 35px;}
   .newsletter .whatnext .button {  margin: 22px 0 22px 35px !important;}
.post .passage {  padding: 60px 35px 60px 35px;}
.post .blogFooter {  padding: 0px 10px 0px 10px;}
.newsletter .newsletterNav {   padding: 100px 15px 100px 30px;}
#wrapper > header {  top: 0; position: fixed;  width: 100%;  overflow: hidden;  height: 36px;  background: transparent;   z-index: 600;   left: 0;   display: block;  -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
#wrapper > header.south {background: #f2f2f2; z-index:9999; height:43px;  -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}
#wrapper > header.south.active , #wrapper > header.active  {height: 100vh; z-index: 1800;}
#wrapper > header.active section.mobile svg {margin: -11px 0 0 12px;}
.slider {  padding: 0 0 50px 4px;  }
.projectFilters, .shopFilters {  margin: 50px 0 30px 0;    padding: 0 15px 0 0; }
.projects .slider {  padding: 0 0 0px 0px;}
#direct .heading { margin: 10px 0 0 -10px;}
#direct form {  margin: 35px 10px 10px 36px;}
#portfolio .chapter .heading {  margin: 25px 10px 0px 10px;  padding: 0 0 0 25px;   }
#portfolio .devicePair {  padding: 0 0 0 0px; }
#portfolio .row.rollerInvert .rollerImages {  padding: 50px 0 50px 20px;    }
#portfolio .row .rollerImages { padding: 50px 20px 50px 0px;  }
#portfolio .chapter .var006_2 img:last-child {  transform: unset;    }
#portfolio .chapter .var006_2 img { max-width: 100%;}
.subNav img { max-height: 20px; max-width: 18px !important;}
#portfolio .chapter .mag {  padding: 0 35px 0 35px;}
#portfolio .chapter .mag .magvar001 {display: grid; grid-template-columns: repeat(1, 1fr); grid-template-rows: repeat(4, 0fr);grid-column-gap: 10px; grid-row-gap: 0.9%; margin: 0;}
#portfolio .chapter .mag .magvar001 p {padding: 0 25px 0 0; margin:0 0 60px 0;}
#portfolio .chapter .mag > div {   margin: 0 0 0 0px;    }
#portfolio .row.roller .rollerText .waypoint p {  padding: 0 50px 0 18px; }
#portfolio .chapter .mag .magvar004 p, #portfolio .chapter .mag .magvar004 h3 {   padding: 0;}
/*#portfolio .rollerImages.desktop img {height: 57vh;}
#portfolio .rollerImages.desktop ul {height: 57vh;}*/

#portfolio .deviceDesktop .row.roller .rollerText .waypoint p {padding:25px; font-size:14px!important;}
#portfolio .deviceDesktop .row.roller .rollerText { margin-left: -370px;  }
#portfolio .row.roller.wide .rollerImages.mainimgShrink ul { height: 45vh; }
#portfolio .row.roller.wide .rollerImages.mainimgShrink img {height: 45vh; }
#portfolio .deviceDesktop .row.roller {margin: 100px 0px 100px 20px; }
#portfolio .deviceDesktop .row.roller.wide {   margin: 100px 0 100px 7px;    }
#portfolio .row.roller.wide .rollerImages.mainimgShrink ul , #portfolio .row.roller.wide .rollerImages.mainimgShrink img { height: 295px; }

#portfolio .chapter.noTestimonial .imageQuote >div:last-child {max-width: unset;padding: 0 38px;}
#portfolio .chapter.noTestimonial .imageQuote .shortTestimonial p {  font-size: 18px;}
#portfolio .chapter.noTestimonial .imageQuote > div:first-child {  padding: 0;}
#portfolio .chapter.noTestimonial .imageQuote .noTestimonial {padding: 0 60px; }
#portfolio .chapter.noTestimonial .imageQuote {  width: 100%;}
#portfolio .chapter.noTestimonial .imageQuote > div:first-child img{ padding: 45px 45px 0 45px; margin:0;  max-width: 100vw;}
#portfolio .chapter.noTestimonial .imageQuote >div:last-child {padding: 0 46px;  margin: 0;}
.my-room-outside #portfolio .chapter .mag .magvar014 .magcell_2 img {  left: -20px; flex: 0 0 49%;}
.my-room-outside  #portfolio .chapter .mag .magvar014 .magcell_2 {flex-wrap: wrap;}
.sigga-knitwear #portfolio .chapter .mag .magvar014 .magcell_2 img {  left: -6px; flex: 0 0 46%;}
.sigga-knitwear #portfolio .chapter .mag .magvar014 .magcell_2 {flex-wrap: wrap;}


#portfolio .chapter.noTestimonial.alt .imageQuote > div:first-child img {padding: 0 0 0 80px;}
.about .grid_imgGrid {margin: 0 0 100px 0;}
.about .grid_imgGrid .img3 {  grid-area: 6 / 3 / 8 / 5;}
.about .grid_imgGrid { padding: 0 25px 0 25px;}
#portfolio .chapter .mag .magvar008 p {max-width:unset;}
.instagramLinks, .instagram #direct p {  margin: 0 15px 0 34px!important;}
.projectFilters .subNav li {  padding: 6px 0;}
.returnsuccess{ margin: 0 0 0 37px;}

#portfolio .chapter.noTestimonial.alt .imageQuote {}
#direct p, #direct ul { margin: 0 40px 0 33px;}
#direct a.button {margin: 25px 40px 25px 33px;}
.formhere + .heading {margin:80px 0 0 -10px!important;}
.project-close #direct .subNav > span { margin: 0 0 25px 30px;}
.project-close #direct .newsletterOnboard p { margin: 0 0 0 -12px!important;}
.newsletter .newsletterOnboard p { margin: 0 0 0 -12px!important;}

#portfolio .rollerImages.phone, #portfolio .rollerInvert .rollerImages.phone { justify-content: center;}
#portfolio .rollerImages.phone {padding: 110px 0px 50px 0px!important;}
#portfolio .row.rollerInvert > div:last-child {transform: translateX(24px);}


#portfolio .devicePhone.special .row.roller { margin: 100px 0px 100px 35px;  }
 #portfolio .devicePhone.special .row.roller .rollerText {  margin-left: -350px;  min-width: 100%;  }
#portfolio .devicePhone.special .row.roller .rollerText .waypoint p {  margin: 140px 0px 0 0;}
#portfolio .devicePhone.special .row.roller .rollerText { margin-left: -85%;  min-width: 100%;  }
#portfolio .devicePhone.special {padding:30px 0 0 0;}
.fragrances-of-the-world .specialWrapper #card1 .logo img, .fragrances-of-the-world .specialWrapper #card0 .logo img {max-width:200px;}
.fragrances-of-the-world .specialWrapper .card {height: 95vh;}
.fragrances-of-the-world .specialWrapper #card1 h1, .fragrances-of-the-world .specialWrapper #card2 h1, .fragrances-of-the-world .specialWrapper #card3 h1 {  font-size: calc(26px + 0.5vw);}
.fragrances-of-the-world .specialWrapper #card1 h1 span, .fragrances-of-the-world .specialWrapper #card0 h1 span {  font-size: calc(12px + 0.5vw);}
.fragrances-of-the-world .specialWrapper #card1 .buttonrow { padding: 10px;}
.fragrances-of-the-world  #portfolio .devicePhone.special .row.roller .rollerText .waypoint {  width: 100%;  justify-content: end; }
#portfolio .devicePhone.special .row.roller .rollerText .waypoint p {max-width: 80%; width:80%}

.about .grid_imgGrid { margin: 0 ; }
section.mobile {display:block!important;}
section.usual {display:none;}
section.mobile svg { width: 160px;  margin: -26px 0 0 12px;}

.blog .sendbutton {	padding: 0 35px 0 35px;}

.propertyTile h3 {margin: 17px 0 0 0;}
.propertyTile h2 {margin: 8px 0 0 0;}

#portfolio .textOnly2Col {   padding: 60px 45px 60px 35px;}

#spotlight {  padding: 0 35px 0 35px;  }
#spotlight > div:nth-child(2) img {  margin: 20px 0;  width: 31px;  }
#spotlight > div:nth-child(2) { height: 365px; flex: 0 0 60px;}
#spotlight > div:first-child {  flex: 0 0 80%; align-items: end; display:flex;}
#spotlight > div:last-child{padding: 60px 30px 0px 50px;}
#spotlight .spotlightLogo { width: 80px;  height: 80px;}
#spotlight { margin:70px 0;}
 .slideContent.finalSlide {  padding:0 0 0 20px;}
.simpleBody {  padding:20px 10px 40px 10px;  }
.simpleBody > div p {	max-width: unset;	padding: 0 30px 20px 45px;}
 .home .simpleBody {  padding: 0px 45px 200px 10px;}
 
 .shoppages #productFeed {    padding: 0 0 50px 35px;  }
  .shoppages .itemDetails > section#productPhotography {    padding: 0 0 60px 35px;}
.shoppages .itemDetails > span { top: 3px;  left: 35px;  }
 .shoppages .itemDetails > section {    flex: 0 0 95%;}
 .shoppages .inputText {  padding: 9px 7px 11px 7px;}
 .shoppages .cartContent.populated .cart-items li {flex-wrap: wrap;}
 .shoppages .cart-items li > strong {  flex: 0 0 100%; margin: 15px 25px;}
.shoppages .cart-items li .item-price {  margin: 0px 30px 1px 24px;}
.shoppages #productFeed .product {  flex: 0 0 43.8%;    }
.shoppages #similarProducts #productFeed {width:100%;}

.blog #blogfilter {  padding: 0 35px 0px 35px;}


.fragrances-of-the-world .specialWrapper #card3 #wheelHolder {  bottom: -896px;  }



#dbanner {  flex-wrap: nowrap;    margin: 110px 35px 0;  clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 0% 100%, 0px 40px, 40px 0px);  display: flex;   max-width: 430px;    width: auto;   flex-direction: column;  }
#dbanner div:last-child img {   right: -60px; left:unset;  }
}
  
@media (max-width: 510px) { 

 .post .postnavigation td:hover a:last-child::after {left:0px;}
.returnsuccess{ margin: 0 0 0 -31px;}
.instagramLinks, .instagram #direct p {  margin:0 15px 0 -30px !important;}
.subNav img {left: -34px; max-height: 20px;  max-width: 19px !important;}
.subNav ul.action li:nth-child(3) img {transform: scale(1.3);}
.subNav ul.action a {  font-size: 14px; margin: 0 0 0 33px;}
.triGrid .row > div .subNav ul li a  {font-size:11px;}
.projectFilters{padding:0 40px 0 70px;}
/*#direct { margin: 75px 42px 10px 67px !important;}*/
#direct form { margin: 35px 0 40px -29px;}
.subSplash #splash #splashContent {  padding:75px 10px 75px 10px !important;}	
#direct .heading {  margin: 0 0 0 -75px;}
#direct .heading  h1:before { left: 17px;}
#direct .subNav ul li a {display:inline;}
.directInner { padding: 25px 15px 25px 55px; }
#direct p, #direct ul {  margin: 0 0 0 -30px;}
.formhere + .heading {margin: 0 0 0 -75px !important;}
 .formhere + .heading h2::before {left:17px;}

.instagram .instagramLinks li a {diplay:inline;}
#direct + #direct { margin: 0px 42px 10px 67px !important;}
.instagram .instagramLinks { margin: 0 0 0 -31px;}
.project-close #direct .newsletterOnboard > div:first-child em {  margin: 0 0 22px -14px;  }
.newsletter .newsletterOnboard > div:first-child em {  margin: 0 0 22px -14px;  }
.blogsocial .resp-sharing-button__link { margin: 0.5em 2px;}
.post .passage {  padding: 30px 35px 0px 35px;}

#portfolio .postnavigation { margin: 200px 45px 0 25px;}
#portfolio .nextProject, #portfolio .prevProject { margin: 12px 0px 0px 0px;}
.home #splash #splashAnimation {background-position: center center;}   
table#projectNav tr {display: flex;   flex-wrap: wrap;} 
table#projectNav tr td{ position: relative; flex: 0 0 100%; min-height:unset;}
#portfolio .postnavigation td { min-height: unset; padding: 0 0 20px 0;}
table#projectNav tr td img, .post .nextProject:before , .post .prevProject:before, #portfolio .prevProject:before, #portfolio .nextProject:before  { display: none;}
.post .postnavigation td:last-child {padding: 13px 0 0 0; }
.post .prevProject { margin: 12px 0px 0px 0px;}
.post .postnavigation td a:last-child { width: 100%;}
.post .postnavigation {  margin: 400px 0 0 0;   padding: 0px 35px 0px 35px;   }
.post .blogFlyout {padding:30px; margin: -30px 0 0 0; width:250px; left: 50%; transform: translate(-125px , 0px);}
.blogsocial .blogLink {  float: none;   top: 4px;  padding: 0 8px 0 18px;}
.post .postnavigation td a:first-child:before { top: -24px;}
 @keyframes flyout {
  0% { opacity: 0;  }
  5% { opacity: 0.2; }
  17% { opacity: 0.75; }
  25% { opacity: 0.2;border-top-color:#5eb4ef; border-left-color:#d9d9d9;border-right-color:#d9d9d9;border-bottom-color:#d9d9d9; }
  32% { opacity: 0.75;border-top-color:#d9d9d9; border-left-color:#5eb4ef;border-right-color:#d9d9d9;border-bottom-color:#d9d9d9; }
  39% { opacity: 0.2;border-top-color:#d9d9d9; border-left-color:#d9d9d9;border-right-color:#5eb4ef;border-bottom-color:#d9d9d9; }
  46% { opacity: 0.75;border-top-color:#d9d9d9; border-left-color:#d9d9d9;border-right-color:#d9d9d9;border-bottom-color:#5eb4ef;}
  100% {  opacity: 1;top: 75px; left: 50%; position:absolute; width:250px;}
 }
#portfolio .deviceDesktop .row.roller { margin: 100px 0px 0px -5px; }
#portfolio .deviceDesktop .row.roller .rollerText { margin-left: -280px; z-index: 800;}
/*#portfolio .deviceDesktop .row.roller .rollerText { margin-left: -315px; }
#portfolio .chapter .imageQuote > div:first-child {	padding: 0 0 0 55px;}*/
#portfolio .deviceDesktop .row.roller.wide .rollerText {  z-index: 800;  }
.fourohfour .core, .fourohfour .action { padding: 0 0 0 0px !important;  }
#direct p, #direct ul { margin: 0 0 0 -40px;}

#portfolio .chapter .crop_mro01 { border-radius: 0 40px 40px 0;}
#portfolio .chapter .imageQuote .longTestimonial {   max-width: unset !important;}
#portfolio .chapter .mag .magvar018 .magcell_1 img { flex: 1 0 10%; width: 31%; }
#portfolio .projNav {  justify-content: start;}
.post .nextProject, .post .prevProject {   margin: unset;}
#portfolio .chapter .mag .magvar003 .magcell_1 div:first-child { transform: rotate(-45deg) scale(0.8) translate(-10%, 1%);}
article#portfolio {   width: calc(100vw - 0px);}
body {-webkit-text-size-adjust: 100%;}
#portfolio .chapter.noTestimonial.alt .imageQuote > div:first-child img, #portfolio .chapter.noTestimonial.alt .imageQuote .noTestimonial { padding: 0 35px;}
.instagram .instagramLinks .button {margin:12px 15px 0px 0px!important;}
#direct p, #direct ul { margin: 0 40px 0 -30px;}
#direct a.button {margin: 25px 40px 0 -30px;}
 .project-close #direct .newsletterOnboard {  margin: 70px 0 40px -40px;  }
 .project-close #direct .newsletterOnboard {padding:35px;}
 .newsletter .newsletterOnboard {  margin: 70px 0 40px -40px;  }
.newsletter .newsletterOnboard {padding:35px;}
 .project-close #direct .subNav > span {   margin: 0 0 25px -30px;  }
   .about .grid_imgGrid .img6 p,    .about .grid_imgGrid .img7 p { color: #1d1e22;  font-size: 21px; line-height: 30px; max-width: 290px;}
   .grid_imgGrid .img6 {  padding: 32px 0 0 0;}
   #testimonials{  min-height: 80vh; }
    #portfolio .rollerImages.desktop img,  #portfolio .rollerImages.desktop ul {height: 400px;}
   .newsletter .whatnext h2 {margin: 50px 0 21px -30px;}
   .newsletter .returnsuccess {  margin: 0 0 14px -30px;}
   .newsletter .whatnext .button {  margin: 22px 0 22px -30px !important;}
   #portfolio #introCaption img { bottom: -20px;  right: -20px;}
   .fourohfour #direct ul {  margin: 0 20px 0 -30px;}
   .project-close #direct .subNav ul.social {display: flex;  flex-wrap: wrap;  margin: 0 20px 0 -30px;}
   #portfolio .postnavigation td:last-child {  align-items: flex-start;}
   .fragrances-of-the-world .specialWrapper #card1 .buttonrow .button, .fragrances-of-the-world .specialWrapper #card0 .buttonrow .loginbutton {    padding: 6px 21px;}
   .fragrances-of-the-world .specialWrapper #card3 .modal .modaldescription p {font-size: calc(11px + 0.5vw); line-height: calc(17px + 0.5vw);}
   
   #dbanner div:last-child img {   right: -113px;  }
}
	
@media (max-width: 440px)  {
#testimonials .testimonials {  margin: 0 0 0 13px;	}
.subNav ul.action, .subNav ul.social, .subNav > span {  padding: 0 30px;}
.triGrid .row.substitute1 > div {padding: 10px 0; }
.project-close #direct .newsletterOnboard > div:first-child a { margin: 25px 0 0 -12px;}
.project-close #direct .newsletterOnboard > div:last-child img {   padding: 0 0 0 2px;    }
.newsletter .newsletterOnboard > div:first-child a { margin: 25px 0 0 -12px;}
.newsletter .newsletterOnboard > div:last-child img {   padding: 0 0 0 2px;    }
.newsletterMail .testimonial img {padding:10px 0 0 0!important;}
.newsletterMail .center {text-align: center!important;}
.newsletterMail .longertd {padding:5px 5px 5px 25px!important;}
.newsletterMail .deemphasise span {font-size: 26px !important;line-height:32px !important;	display: block;}
.newsletterMail .notoppad {padding:0!important;}
.newsletterMail .hide {display:none!important;}
.newsletterMail .rightSide.buttonholder { padding: 0px 39px 22px 65px!important;}
.newsletterMail .smllbtn {padding:15px!important;}

.newsletter .newsletterShowcase span.scTrigger {  left: -17px;    transform: scale(0.7);     background: #f2f2f2;     padding: 0 10px 0 22px;     top: 103px!important;   }
.newsletter .newsletterShowcase span.upTrigger { left: -17px; transform: scale(0.7) rotate(90deg);  background: #f2f2f2;  padding: 0 10px 0 22px;  top: 130px !important;   height: 59px;}	
.newsletter .newsletterShowcase span.yearTrigger {  left: -9px;  transform: scale(0.7);   background: #f2f2f2; padding: 10px 16px 0px 16px; top: 171px !important; height: 43px;  display: block;  position: fixed;   cursor: pointer; }
.newsletter .emailNav ul {display:none;}
.newsletter .emailNav ul.active {display: inline;   width: auto;   padding: 0 60px;}
.newsletter .newsletterNav { position: absolute; padding: 100px 0px 100px 0px;  }
.newsletter .emailNav ul { padding:0 0 0 60px;   position: absolute;     width: 100%;      background: #f2f2f2;      top: 0;    }
.newsletter .emailNav ul li span {display:inline;}	
#splash #splashContent #splashIntro{padding:25px 25px 25px 0px;}
 .home #splash #splashContent #splashIntro { padding: 55px 25px 25px 0px;  }
#splash #splashContent #splashIntro .heading, .heading {  padding: 0 0 0 35px;}
.directInner .heading {  padding: 0 0 0 45px; }

.slider .slideCaption {padding: 25px;}
.slider .slideCaption img { margin: -75px 0 15px -25px;  max-width: 150px;     padding: 22px;}
.subNav ul.action, .subNav ul.social, .subNav > span {    padding: 0 0 0px 35px;}
.triGrid .row.substitute1 > div { padding: 10px 0}
.triGrid .row > div:first-child, .triGrid .row.alt > div:nth-child(2n) {/*  padding: 10px 0;  */ }
.triGrid .row > div .subNav ul.social {  transform: translate3d(-7px, 0, 0);    }
#clients #clientLogos .clientLogos {   padding: 110px 0;  min-height: 400px;   flex-wrap: wrap;    }
#clients #clientLogos .clientLogos li {   flex: 0 0 100%; width: 100%;	}
#clients #clientLogos .clientLogos li p {justify-content:center;}
#clients #clientLogos .clientLogos li.active {   display: inline-block;    }
#clients #clientLogos .clientLogos li img {transform: scale(0.7);   max-width: unset;   margin:15px 0; }
#splash #splashGlyphs span {  transform: scale(70%)!important; min-width: 400px;} 
.blog #introCaption {  padding: 25px 25px;}
#portfolio .rollerImages.phone ul, #portfolio .rollerImages.phone img { height: 360px;}
#portfolio .rollerInvert .rollerImages.phone > div:after {left: -1px;     width: 101%;}
#portfolio .row.rollerInvert .rollerImages { padding: 50px 0 50px 7px;  }
#portfolio .row.roller .rollerText .waypoint {  padding: 0 15px 0 0;	}
#portfolio .rollerImages.phone > div:before {    width: 101%;   left: -1px;   top: 16px;    }
#portfolio #introCaption {  padding: 25px 25px 105px 25px; }
#portfolio .chapter .mag .magvar001 p {padding: 0 25px 0 0; margin:0 0 60px 0; max-width: unset;}
.subNav img { left: -34px; max-height: 20px;  max-width: 19px !important;}
#portfolio .row.roller .rollerText .waypoint p {padding: 0 18px 0 18px;}
#portfolio .chapter .mag .magvar004 .magcell_2 img {  flex: 0 0 50%; padding: 15px; left:0; }

#portfolio .chapter.noTestimonial.alt .imageQuote > div:first-child img {  padding: 0 0 0 0px;}
#portfolio .chapter.noTestimonial.alt .imageQuote .noTestimonial {  padding: 0 35px; }
 #testimonials{  min-height: 60vh; }

 #spotlight > div:nth-child(2) h2 {font-size: 12px;}
   #spotlight > div:nth-child(2) {    flex: 0 0 48px;    height: 305px;  }
    #spotlight > div:nth-child(2) h2 {   bottom: 133px;}
	 #spotlight > div:nth-child(2) img {  margin: 16px 0;}
	   #spotlight > div:last-child > span {  display: none;  }
	   #spotlight > div:last-child {padding: 60px 30px 0px 30px;}
	   #spotlight > div:last-child li {  padding:7px 0 0 15px;}
	   #spotlight > div:last-child li::before {top: 15px;}
.simpleBody > div p {   padding:0 30px 20px 35px;  }
.slideContent.finalSlide {   padding: 10px;  }
.home .simpleBody {	  padding: 0px 10px 200px 10px;}
.shoppages .slideCaption.saleItem h3::before {top: -50px;  left: -25px;}
.shoppages #productFeed .product {    flex: 0 0 92%;}
.shoppages .itemDetails > span {  top: 43px;}
 .blog #blogfilter .archive li:not(:first-child) {    width: 320px;  }
.fragrances-of-the-world .specialWrapper #card3 #wheelHolder { bottom: -635px; }
.fragrances-of-the-world .specialWrapper #card3 #familyName_1, .fragrances-of-the-world .specialWrapper #card3 #familyName_2, .fragrances-of-the-world .specialWrapper #card3 #familyName_3 {  font-size: 15px;  color: #000;  max-width: 110px; padding: 75px 0 0 0; text-shadow:unset;  margin: 0 0 0 -55px;}
.fragrances-of-the-world .specialWrapper #card1 h1, .fragrances-of-the-world .specialWrapper #card2 h1, .fragrances-of-the-world .specialWrapper #card3 h1 {  font-size: calc(22px + 0.5vw); }
.fragrances-of-the-world .specialWrapper #card3 .searching {   line-height: 12px;    font-size: calc(7px + 0.5vw);  width: 200px;  top:105px;  margin: 0 0 0 -100px;   left: 50%;}
.fragrances-of-the-world .specialWrapper #card3 #wheelHolder.loading #wheel {width: 80%;}
}

@media (max-width: 310px)  {	
	.about .grid_imgGrid .img6 p, .about .grid_imgGrid .img7 p {font-size: 14px;}
}