@import url(https://p.typekit.net/p.css?s=1&k=urh5vsh&ht=tk&f=13464.18481.18482.18483.18486.18487.18498.18500.44384.44385.44390.44391&a=85933483&app=typekit&e=css);
.container,
.egg.header .header__wrap a img {
margin: 0 auto;
}
progress,
sub,
sup {
vertical-align: baseline;
}
.egg.error h1,
.egg.hero,
.egg.project-card,
main,
sub,
sup {
position: relative;
}
.egg.header,
main {
background-color: #fff;
}
*,
legend,
ol,
ul {
padding: 0;
}
*,
.generic li:last-of-type,
.generic p:last-of-type,
body,
ol,
p:last-of-type,
ul {
margin: 0;
}
.egg.header,
.egg.header .header__nav a,
.egg.header .header__wrap a img,
.l-select .l-select__options li,
.l-select i svg,
a {
transition: 0.3s ease-in-out;
}
.egg.about h1,
.egg.header .header__nav a,
.egg.header .header__wrap button,
.egg.profile h3,
.egg.project-story .project-story__services h2,
.egg.quick-nav header span,
.project-filter__dialog .project-filter__close {
font-family:
freight-display-pro,
Times New Roman,
Times,
serif;
}
.egg.about h2,
.egg.address article,
.egg.banner h1 i,
.egg.contact .contact__item h2,
.egg.error h1,
.egg.footer .footer__item h2,
.egg.hero figcaption,
.egg.profile h2,
.egg.quick-nav header h2,
.egg.services h2,
.egg.services h3,
.egg.showcase h2,
.egg.story h2,
.generic h2 {
font-family:
freight-big-pro,
Times New Roman,
Times,
serif;
}
.egg.banner,
body.is-drawer-open,
body.is-popup-open {
overflow: hidden;
}
.egg.banner h1,
.egg.header .header__footer,
.egg.header .header__nav a,
.egg.header .header__wrap button,
.l-btn,
.l-select {
text-transform: uppercase;
}
.generic li a,
.generic p a,
.l-card-link,
.l-select,
.project-filter__dialog li p,
[role="button"],
button {
cursor: pointer;
}
.egg.carousel .carousel__wrap,
.l-select .l-select__wrap.disable-filter,
.l-select i,
.project-filter__dialog li span,
.project-filter__dialog ul.disable-filter-list li p {
pointer-events: none;
}
*,
:after,
:before {
box-sizing: border-box;
}
html {
line-height: 1.15;
-webkit-text-size-adjust: 100%;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
}
.egg.address .leaflet-bottom .leaflet-right,
.egg.header .header__nav ul,
.generic li:empty,
.generic p:empty,
.l-select select,
body,
p:empty {
display: none;
}
hr {
height: 0;
color: inherit;
}
abbr[title] {
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
}
b,
strong {
font-weight: bolder;
}
code,
kbd,
pre,
samp {
font-size: 1em;
}
small {
font-size: 80%;
}
sub,
sup {
font-size: 75%;
line-height: 0;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
table {
text-indent: 0;
border-color: inherit;
}
button,
input,
optgroup,
select,
textarea {
font-family: inherit;
font-size: 100%;
line-height: 1.15;
margin: 0;
}
.egg.footer .footer__item a,
.egg.footer .footer__item address,
body,
html {
font-family:
calibre medium,
system-ui,
Segoe UI,
Roboto,
Helvetica,
Arial,
sans-serif;
}
button,
select {
text-transform: none;
}
[type="button"],
[type="reset"],
[type="submit"],
button {
-webkit-appearance: button;
}
::-moz-focus-inner {
border-style: none;
padding: 0;
}
:-moz-focusring {
outline: ButtonText dotted 1px;
}
:-moz-ui-invalid {
box-shadow: none;
}
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
height: auto;
}
[type="search"] {
-webkit-appearance: textfield;
outline-offset: -2px;
}
::-webkit-search-decoration {
-webkit-appearance: none;
}
::-webkit-file-upload-button {
-webkit-appearance: button;
font: inherit;
}
summary {
display: list-item;
}
.aspect-box:before,
body.is-loaded,
img {
display: block;
}
address {
font-style: normal;
}
[hidden] {
display: none !important;
}
@font-face {
font-family: freight-text-pro;
src:
url(https://use.typekit.net/af/ac6334/000000000000000000012059/27/l?fvd=n4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff2"),
url(https://use.typekit.net/af/ac6334/000000000000000000012059/27/d?fvd=n4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff"),
url(https://use.typekit.net/af/ac6334/000000000000000000012059/27/a?fvd=n4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("opentype");
font-display: auto;
font-style: normal;
font-weight: 400;
font-stretch: normal;
}
@font-face {
font-family: freight-big-pro;
src:
url(https://use.typekit.net/af/e5e434/000000000000000077359f99/30/l?fvd=i7&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff2"),
url(https://use.typekit.net/af/e5e434/000000000000000077359f99/30/d?fvd=i7&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff"),
url(https://use.typekit.net/af/e5e434/000000000000000077359f99/30/a?fvd=i7&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("opentype");
font-display: auto;
font-style: italic;
font-weight: 700;
font-stretch: normal;
}
@font-face {
font-family: freight-big-pro;
src:
url(https://use.typekit.net/af/a91824/000000000000000077359f9d/30/l?fvd=n4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff2"),
url(https://use.typekit.net/af/a91824/000000000000000077359f9d/30/d?fvd=n4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff"),
url(https://use.typekit.net/af/a91824/000000000000000077359f9d/30/a?fvd=n4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("opentype");
font-display: auto;
font-style: normal;
font-weight: 400;
font-stretch: normal;
}
@font-face {
font-family: freight-big-pro;
src:
url(https://use.typekit.net/af/5d264d/000000000000000077359fa0/30/l?fvd=i4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff2"),
url(https://use.typekit.net/af/5d264d/000000000000000077359fa0/30/d?fvd=i4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff"),
url(https://use.typekit.net/af/5d264d/000000000000000077359fa0/30/a?fvd=i4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("opentype");
font-display: auto;
font-style: italic;
font-weight: 400;
font-stretch: normal;
}
@font-face {
font-family: freight-big-pro;
src:
url(https://use.typekit.net/af/b1b6ad/000000000000000077359fa8/30/l?fvd=n5&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff2"),
url(https://use.typekit.net/af/b1b6ad/000000000000000077359fa8/30/d?fvd=n5&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff"),
url(https://use.typekit.net/af/b1b6ad/000000000000000077359fa8/30/a?fvd=n5&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("opentype");
font-display: auto;
font-style: normal;
font-weight: 500;
font-stretch: normal;
}
@font-face {
font-family: freight-big-pro;
src:
url(https://use.typekit.net/af/8c8500/000000000000000077359faa/30/l?fvd=i5&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff2"),
url(https://use.typekit.net/af/8c8500/000000000000000077359faa/30/d?fvd=i5&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff"),
url(https://use.typekit.net/af/8c8500/000000000000000077359faa/30/a?fvd=i5&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("opentype");
font-display: auto;
font-style: italic;
font-weight: 500;
font-stretch: normal;
}
@font-face {
font-family: freight-display-pro;
src:
url(https://use.typekit.net/af/702331/000000000000000077359fa7/30/l?fvd=n5&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff2"),
url(https://use.typekit.net/af/702331/000000000000000077359fa7/30/d?fvd=n5&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff"),
url(https://use.typekit.net/af/702331/000000000000000077359fa7/30/a?fvd=n5&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("opentype");
font-display: auto;
font-style: normal;
font-weight: 500;
font-stretch: normal;
}
@font-face {
font-family: freight-display-pro;
src:
url(https://use.typekit.net/af/5b2861/000000000000000077359fad/30/l?fvd=n6&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff2"),
url(https://use.typekit.net/af/5b2861/000000000000000077359fad/30/d?fvd=n6&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff"),
url(https://use.typekit.net/af/5b2861/000000000000000077359fad/30/a?fvd=n6&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("opentype");
font-display: auto;
font-style: normal;
font-weight: 600;
font-stretch: normal;
}
@font-face {
font-family: freighttextcmp-pro;
src:
url(https://use.typekit.net/af/b4153c/000000000000000077359fde/30/l?fvd=n4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff2"),
url(https://use.typekit.net/af/b4153c/000000000000000077359fde/30/d?fvd=n4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff"),
url(https://use.typekit.net/af/b4153c/000000000000000077359fde/30/a?fvd=n4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("opentype");
font-display: auto;
font-style: normal;
font-weight: 400;
font-stretch: normal;
}
@font-face {
font-family: freighttextcmp-pro;
src:
url(https://use.typekit.net/af/373ea7/000000000000000077359fdf/30/l?fvd=i4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff2"),
url(https://use.typekit.net/af/373ea7/000000000000000077359fdf/30/d?fvd=i4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff"),
url(https://use.typekit.net/af/373ea7/000000000000000077359fdf/30/a?fvd=i4&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("opentype");
font-display: auto;
font-style: italic;
font-weight: 400;
font-stretch: normal;
}
@font-face {
font-family: freighttextcmp-pro;
src:
url(https://use.typekit.net/af/d583d8/000000000000000077359fe4/30/l?fvd=n7&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff2"),
url(https://use.typekit.net/af/d583d8/000000000000000077359fe4/30/d?fvd=n7&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff"),
url(https://use.typekit.net/af/d583d8/000000000000000077359fe4/30/a?fvd=n7&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("opentype");
font-display: auto;
font-style: normal;
font-weight: 700;
font-stretch: normal;
}
@font-face {
font-family: freighttextcmp-pro;
src:
url(https://use.typekit.net/af/0e4bed/000000000000000077359fe5/30/l?fvd=i7&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff2"),
url(https://use.typekit.net/af/0e4bed/000000000000000077359fe5/30/d?fvd=i7&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("woff"),
url(https://use.typekit.net/af/0e4bed/000000000000000077359fe5/30/a?fvd=i7&primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&v=3) format("opentype");
font-display: auto;
font-style: italic;
font-weight: 700;
font-stretch: normal;
}
.tk-freight-text-pro {
font-family: freight-text-pro, serif;
}
.tk-freight-big-pro {
font-family: freight-big-pro, serif;
}
.tk-freight-display-pro {
font-family: freight-display-pro, serif;
}
.tk-freighttextcmp-pro {
font-family: freighttextcmp-pro, serif;
}
@font-face {
font-family: Calibre Medium;
src:
url(//eggoffice.com/wp-content/themes/egg-office/css/fonts/Calibre-Medium.woff2) format("woff2"),
url(//eggoffice.com/wp-content/themes/egg-office/css/fonts/Calibre-Medium.woff) format("woff");
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Calibre Regular;
src:
url(//eggoffice.com/wp-content/themes/egg-office/css/fonts/Calibre-Regular.woff2) format("woff2"),
url(//eggoffice.com/wp-content/themes/egg-office/css/fonts/Calibre-Regular.woff) format("woff");
font-weight: 400;
font-style: normal;
font-display: swap;
}
body,
html {
color: #000;
font-size: 16px;
}
main {
z-index: 2;
}
* {
-webkit-tap-highlight-color: transparent;
-webkit-text-size-adjust: none;
-ms-text-size-adjust: none;
text-size-adjust: none;
}
.egg.header {
position: sticky;
top: 0;
z-index: 99;
padding-bottom: 2.1625rem;
}
.is-drawer-open .egg.header {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100dvh;
background-color: #fff;
z-index: 999;
}
.egg.header .header__wrap {
position: relative;
padding: 2.0625rem 0 0;
}
.egg.header .header__wrap figure {
width: fit-content;
margin: 0 auto;
transition: 0.3s ease-in-out;
}
.home-page .egg.header .header__wrap figure {
opacity: 0;
}
@media screen and (min-width: 768px) {
.egg.header {
padding-bottom: 3.3125rem;
}
.egg.header .header__wrap {
padding-top: 2.5rem;
}
.egg.header .header__wrap a {
margin-top: -0.125rem;
position: absolute;
left: 50%;
transform: translateX(-51%);
}
.egg.header .header__wrap a img {
width: 9.375rem;
margin-left: 0.1875rem;
}
}
@media screen and (min-width: 1320px) {
.egg.header .header__wrap a img {
width: 11.25rem;
}
}
.egg.header .header__wrap button {
color: #3c3c3c;
background: 0 0;
border: none;
font-size: 0.625rem;
font-weight: 500;
line-height: 12.79px;
position: absolute;
padding: 0.625rem;
right: -0.15625rem;
top: 1.90625rem;
letter-spacing: 1.2px;
}
.is-drawer-open .egg.header .header__nav ul {
display: block;
margin-top: 25.2dvh;
text-align: center;
}
@media screen and (max-height: 600px) {
.is-drawer-open .egg.header .header__nav ul {
margin-top: 15dvh;
}
}
.is-drawer-open .egg.header .header__nav ul li:not(:last-of-type) {
margin-bottom: 2.4375rem;
}
.egg.header .header__nav ul li:nth-child(2) {
margin-right: auto;
}
.egg.header .header__nav a {
font-size: 1.5em;
line-height: 1.2791666667;
letter-spacing: 2.4px;
font-weight: 500;
color: #3c3c3c;
text-decoration: none;
padding-bottom: 0.375rem;
border-bottom: 0.083125rem solid #fff;
}
.egg.header .header__nav a.active_link,
.egg.header .header__nav a:hover {
border-color: #656565;
opacity: 1;
}
.egg.header .header__footer {
width: calc(100% - 30px);
display: none;
font-size: 0.75rem;
margin: 0 0.9375rem;
position: absolute;
bottom: 0;
left: 0;
border-top: 0.0625rem solid #d9d9d9;
padding: 1.6875rem 0.875rem 1.9375rem 0.625rem;
}
.egg.carousel .carousel__item article,
.is-drawer-open .egg.header .header__footer {
display: -ms-flexbox;
display: flex;
}
.egg.header .header__footer figure {
min-width: 1.5625rem;
margin: 0.4375rem auto 0 0;
}
.egg.header .header__footer address {
letter-spacing: 0.96px;
font-size: 0.75rem;
margin-right: 3.0625rem;
line-height: 1.3125rem;
color: #3c3c3c;
font-weight: 500;
}
.egg.header .header__footer nav {
line-height: 0.875rem;
letter-spacing: 0.96px;
margin-top: 0.1875rem;
font-weight: 500;
}
.egg.header .header__footer nav li+li {
margin-top: 0.4375rem;
}
.egg.header.is-below {
z-index: -1;
}
.header-wrapper {
min-height: 5.661875rem;
}
.egg.footer {
background-color: #f5f5f5;
position: relative;
z-index: 1;
}
.egg.footer .footer__wrap {
padding: 1.125rem 0 2.4375rem;
}
.egg.footer .footer__grid {
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
}
.egg.footer .footer__item {
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
justify-content: space-between;
color: #3c3c3c;
padding: 1.625rem 0 1.5625rem;
}
.egg.footer .footer__item:not(.footer__item--logo) {
border-bottom: 0.0625rem solid #d9d9d9;
}
@media screen and (min-width: 768px) {
.egg.header .header__wrap button:not(.header__close) {
display: none !important;
}
.egg.header .header__nav ul {
display: -ms-flexbox;
display: flex;
gap: 5rem;
}
.egg.header .header__nav a {
font-size: 0.75em;
line-height: 1.2791666667;
letter-spacing: 1.2px;
}
.header-wrapper {
min-height: 6.9625rem;
}
.egg.footer {
background-color: #fff;
}
.egg.footer .footer__wrap {
padding: 4.25rem 0 2rem;
}
.egg.footer .footer__grid {
-ms-flex-direction: row;
flex-direction: row;
}
.egg.footer .footer__item {
display: block;
padding: 0;
}
.egg.footer .footer__item:not(:first-of-type) {
border-bottom: 0;
}
.egg.footer .footer__item:nth-of-type(2),
.egg.footer .footer__item:nth-of-type(3),
.egg.footer .footer__item:nth-of-type(4) {
margin-right: 8.57vw;
}
}
@media screen and (min-width: 950px) {
.egg.footer .footer__item:nth-of-type(2),
.egg.footer .footer__item:nth-of-type(3),
.egg.footer .footer__item:nth-of-type(4) {
margin-right: 13vw;
}
}
.egg.footer .footer__item h2 {
font-size: 1.25em;
line-height: 1.266;
font-weight: 400;
}
.egg.footer .footer__item a,
.egg.footer .footer__item address {
font-size: 0.75em;
line-height: 1.1666666667;
letter-spacing: 0.06rem;
text-transform: uppercase;
font-weight: 500;
}
.egg.about p,
.egg.banner a.banner__scroll,
.egg.banner h1,
.egg.blocks p,
.egg.error li,
.egg.error p,
.egg.hero figcaption span,
.egg.profile p,
.egg.project-card .project-card__link,
.egg.project-filter .project-filter__dropdowns,
.egg.project-story p,
.generic,
.generic .generic__subtitle,
.l-btn,
.project-filter__dialog ul {
font-family:
calibre regular,
system-ui,
Segoe UI,
Roboto,
Helvetica,
Arial,
sans-serif;
}
.l-btn,
.l-select {
color: #7e7e7e;
text-transform: uppercase;
line-height: 1.2;
font-weight: 500;
}
.egg.footer .footer__item address {
margin-top: 0.0625rem;
}
@media screen and (min-width: 480px) and (max-width: 767px) {
.egg.footer .footer__item a,
.egg.footer .footer__item address,
.egg.footer .footer__item ul {
width: 48%;
}
}
.egg.address article li,
.egg.footer .footer__item li {
margin-bottom: 0.125rem;
}
.egg.footer .footer__item--logo {
-ms-flex-pack: center;
justify-content: center;
-ms-flex-align: center;
align-items: center;
padding: 0.625rem 0 0;
}
@media screen and (max-width: 767px) {
.egg.footer .footer__item:nth-of-type(3) {
padding: 1.3125rem 0 1.25rem;
}
.egg.footer .footer__item:nth-of-type(4) {
padding: 1.25rem 0 1.1875rem;
}
.egg.footer .footer__item:nth-of-type(5) {
padding: 1.3125rem 0 1.1875rem;
}
.egg.footer .footer__item a,
.egg.footer .footer__item address,
.egg.footer .footer__item ul {
min-width: 9.875rem;
-ms-flex-line-pack: center;
align-content: center;
}
.egg.footer .footer__item--logo {
-ms-flex-order: 5;
order: 5;
padding: 2.25rem 0 0;
margin-right: 0.1875rem;
}
.egg.about--services p br {
display: none;
}
}
.egg.footer .footer__item--logo figure {
margin-right: 0.5625rem;
width: 0.92125rem;
background-color: transparent;
}
.egg.footer .footer__item--logo p {
font-size: 0.625em;
line-height: 1.2;
letter-spacing: 0.1px;
font-weight: 500;
color: #959595;
}
ol li,
ul li {
list-style: none;
}
a {
text-decoration: none;
color: #3c3c3c;
}
a:hover {
opacity: 0.7;
}
a.l-link {
padding-bottom: 0.625rem;
border-bottom: 1.33px solid #7e7e7e;
}
img {
max-width: 100%;
height: auto;
font-style: italic;
}
.l-card-link {
position: absolute;
width: 100%;
height: 100%;
z-index: 1;
top: 0;
left: 0;
font-size: 0;
}
.l-btn {
border-bottom: 0.083125rem solid #7e7e7e;
font-size: 0.75em;
letter-spacing: 0.96px;
padding-bottom: 0.5rem;
}
.l-select {
font-size: 0.75em;
letter-spacing: 1.2px;
position: relative;
z-index: 3;
background-color: #fff;
width: 10.625rem;
max-width: 18.75rem;
border-bottom: 0.0625rem solid #7e7e7e;
}
.l-select:has(.disable-filter) {
cursor: progress;
}
.l-select:last-of-type {
width: 10.3125rem;
}
.l-select i {
background-image: url(//eggoffice.com/wp-content/themes/egg-office/images/drop-arrow.svg);
background-repeat: no-repeat;
background-size: contain;
width: 0.5rem;
height: 0.625rem;
position: absolute;
top: 0.1875rem;
right: 0;
z-index: 3;
}
.l-select .l-select__wrap {
padding: 0.125rem 0.3125rem 1.25rem 0;
position: relative;
}
.l-select .l-select__options {
position: absolute;
background-color: #fff;
top: 2.125rem;
margin-left: -0.3125rem;
width: 110%;
border: 0.0625rem solid #bfbfbf;
padding: 1.25rem 0 1.25rem 1.1875rem;
cursor: default;
}
.l-select .l-select__options li {
padding: 0.375rem 0;
cursor: pointer;
}
.l-select .l-select__options li:not(.disable-tags):hover {
text-decoration: underline;
text-underline-offset: 0.3125rem;
}
.l-select .l-select__options li.disable-tags {
color: #d9d9d9;
cursor: default;
}
.generic time,
.l-select .l-select__options li.selected {
color: #000;
}
.l-select .l-select__options li.selected.disable-tags {
color: #d9d9d9;
}
.aspect-box {
position: relative;
width: 100%;
background-color: #f5f5f5;
}
.aspect-box canvas,
.aspect-box iframe,
.aspect-box img,
.aspect-box video {
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.aspect-box:before {
content: "";
padding-top: calc(var(--aspect-ratio) * 100%);
}
:disabled {
cursor: default;
}
.container {
max-width: 90rem;
padding: 0 0.9375rem;
}
@media screen and (min-width: 768px) {
.egg.footer .footer__item h2 {
font-size: 1.375em;
line-height: 1.2659090909;
margin-bottom: 0.5625rem;
}
.egg.footer .footer__item a,
.egg.footer .footer__item address {
font-size: 0.625em;
line-height: 1.5;
letter-spacing: 1px;
}
.egg.footer .footer__item address {
margin-top: 0.75rem;
}
.egg.footer .footer__item--logo {
margin-right: auto;
min-width: 4.6875rem;
max-width: 9.375rem;
-ms-flex-positive: 1;
flex-grow: 1;
padding: 0;
}
.egg.footer .footer__item--logo figure {
width: 2.875rem;
margin: 0.4375rem 0 2.625rem;
}
.l-select .l-select__wrap {
padding: 0.125rem 0 1.125rem 0.1875rem;
}
.container {
padding: 0 1.875rem;
}
}
@media screen and (min-width: 1199px) {
.egg.header {
padding-bottom: 3.5625rem;
}
.egg.header .header__wrap {
padding-top: 2.8125rem;
}
.egg.header .header__wrap a {
margin-top: 0;
}
.egg.header .header__nav ul {
margin-top: 0.4375rem;
gap: 8.75rem;
}
.egg.header .header__nav a {
font-size: 0.875em;
line-height: 1.2792857143;
letter-spacing: 1.4px;
}
.header-wrapper {
min-height: 8.056875rem;
}
.egg.footer .footer__wrap {
padding: 4.1875rem 0 2.9375rem;
}
.egg.footer .footer__item h2 {
font-size: 2em;
line-height: 1.265625;
margin-bottom: 0.375rem;
}
.egg.footer .footer__item a,
.egg.footer .footer__item address {
font-size: 0.75em;
line-height: 1.4166666667;
letter-spacing: 1.2px;
}
.egg.footer .footer__item address {
margin-top: 0.5rem;
}
.egg.footer .footer__item--logo figure {
width: 3.17125rem;
margin: 0.625rem 0 2.5625rem;
}
.egg.footer .footer__item--logo p {
font-size: 0.75em;
line-height: 1.2;
}
.l-btn,
.l-select {
font-size: 0.875em;
line-height: 1.2;
letter-spacing: 1.4px;
}
.l-select:last-of-type {
width: 11.125rem;
}
.l-select .l-select__wrap {
padding-top: 0;
padding-bottom: 0.9375rem;
}
.l-select .l-select__options {
top: 2rem;
}
.container {
padding: 0 2.125rem;
}
}
@media screen and (min-width: 1440px) {
.egg.header .header__wrap a img {
width: 12.5vw;
}
.egg.header .header__nav a,
.l-btn,
.l-select {
font-size: 0.9722222222vw;
}
.egg.footer .footer__item:nth-of-type(2),
.egg.footer .footer__item:nth-of-type(3),
.egg.footer .footer__item:nth-of-type(4) {
margin-right: 11rem;
}
.egg.footer .footer__item:last-child {
margin-right: 0;
}
.egg.footer .footer__item h2 {
font-size: 2.2222222222vw;
}
.egg.footer .footer__item a,
.egg.footer .footer__item address,
.egg.footer .footer__item--logo p {
font-size: 0.8333333333vw;
}
.egg.footer .footer__item--logo {
max-width: 10.4166666667vw;
}
.l-select .l-select__options {
width: 11.5277777778vw;
}
.container {
max-width: calc(1440px + 10vw);
}
}
.container--full,
section.section--project-block .container,
section.section--project-intro-block .container,
section.section--project-nav .container {
max-width: 100%;
}
.container--max {
max-width: 100%;
padding: 0;
}
@media screen and (min-width: 1199px) {
.container--max {
padding: 0 2.125rem;
}
}
.container--md {
max-width: 67.75rem;
}
@media screen and (min-width: 480px) {
.container--md {
padding: 0 3.90625rem;
}
}
@media screen and (min-width: 1199px) {
.container--md {
padding: 0;
}
}
@media screen and (min-width: 1440px) {
.container--md {
max-width: calc(1084px + 10vw);
}
}
.container--sm {
max-width: 41.375rem;
}
@media screen and (min-width: 480px) {
.container--sm {
padding: 0 4.6875rem;
}
.egg.about--profile h2 br {
display: none;
}
}
section.section--story {
padding: 9rem 0 11.6875rem;
}
@media screen and (min-width: 768px) {
section.section--story {
padding: 9.5rem 0 11rem;
}
}
@media screen and (min-width: 1199px) {
.container--sm {
padding: 0 2.5rem;
}
section.section--story {
padding: 10.8125rem 0 14.125rem;
}
}
section.section--showcase {
padding: 5.625rem 0 4.375rem;
}
@media screen and (min-width: 768px) {
section.section--showcase {
padding: 8.75rem 0 7.25rem;
}
}
@media screen and (min-width: 1199px) {
section.section--showcase {
padding: 11.875rem 0 8.75rem;
}
}
section.section--story-slider {
padding: 6.125rem 0 2.375rem;
}
@media screen and (min-width: 768px) {
section.section--story-slider {
padding: 8.8125rem 0 0.3125rem;
}
}
@media screen and (min-width: 1199px) {
section.section--story-slider {
padding: 12.5rem 0 1.5rem;
}
}
section.section--filter {
padding: 0.8125rem 0 3.4375rem;
}
@media screen and (min-width: 768px) {
section.section--filter {
padding-bottom: 4.625rem;
}
}
@media screen and (min-width: 1199px) {
section.section--filter {
padding: 2.6875rem 0 4.375rem;
}
}
section.section--project-listing {
min-height: 18.75rem;
padding-bottom: 3.4375rem;
}
@media screen and (min-width: 768px) {
section.section--project-listing {
padding-bottom: 0.0625rem;
}
}
@media screen and (min-width: 1199px) {
section.section--project-listing {
padding-bottom: 1rem;
}
}
section.section--services-about {
padding: 0.8125rem 0 0;
}
@media screen and (min-width: 768px) {
section.section--services-about {
padding: 0.8125rem 0 1.1875rem;
}
}
@media screen and (min-width: 1199px) {
section.section--services-about {
padding: 2.625rem 0 0;
}
}
section.section--services-hero {
padding: 3rem 0 1.6875rem;
}
@media screen and (min-width: 768px) {
section.section--services-hero {
padding-top: 3.125rem;
}
}
@media screen and (min-width: 1199px) {
section.section--services-hero {
padding: 4.3125rem 0 4.6875rem;
}
}
section.section--services {
padding: 1.375rem 0 0.1875rem;
}
@media screen and (min-width: 768px) {
section.section--services {
padding: 2.6875rem 0 1.6875rem;
}
}
@media screen and (min-width: 1199px) {
section.section--services {
padding: 4.1875rem 0 4.375rem;
}
}
section.section--services-clients {
padding: 0.875rem 0 3.375rem;
}
@media screen and (min-width: 768px) {
section.section--services-clients {
padding: 2.1875rem 0 0;
}
}
@media screen and (min-width: 1199px) {
section.section--services-clients {
padding: 4.0625rem 0 1.4375rem;
}
}
section.section--project-nav {
padding: 1rem 0 1.3125rem;
}
@media screen and (min-width: 768px) {
section.section--project-nav {
padding: 0.875rem 0 1.5625rem;
}
}
@media screen and (min-width: 1199px) {
section.section--project-nav {
padding: 2.875rem 0 2.1875rem;
}
}
section.section--project-intro-block {
padding-bottom: 3.25rem;
}
@media screen and (min-width: 768px) {
section.section--project-intro-block {
padding-bottom: 5.875rem;
}
}
@media screen and (min-width: 1199px) {
section.section--project-intro-block {
padding-bottom: 8.375rem;
}
}
section.section--project-story {
padding-bottom: 3.4375rem;
}
@media screen and (min-width: 768px) {
section.section--project-story {
padding-bottom: 3.8125rem;
}
}
@media screen and (min-width: 1199px) {
section.section--project-story {
padding-bottom: 10.6875rem;
}
}
section.section--project-block {
padding-bottom: 3.4375rem;
}
@media screen and (min-width: 768px) {
section.section--project-block {
padding-bottom: 2.5rem;
}
}
@media screen and (min-width: 1199px) {
section.section--project-block {
padding-bottom: 5.625rem;
}
}
section.section--project-related {
padding: 0 0 3.4375rem;
}
@media screen and (min-width: 768px) {
section.section--project-related {
margin-top: 2.375rem;
padding-bottom: 0;
}
}
@media screen and (min-width: 1199px) {
section.section--project-related {
margin-top: 0.125rem;
padding-bottom: 1.75rem;
}
}
section.section--contact-hero {
padding: 1.5625rem 0 3rem;
}
@media screen and (min-width: 768px) {
section.section--contact-hero {
padding: 1.8125rem 0 4.125rem;
}
}
@media screen and (min-width: 1199px) {
section.section--contact-hero {
padding: 3.75rem 0 6.3125rem;
}
}
section.section--contact-address {
padding-bottom: 3.1875rem;
}
@media screen and (min-width: 768px) {
section.section--contact-address {
padding-bottom: 4.25rem;
}
}
@media screen and (min-width: 1199px) {
section.section--contact-address {
padding-bottom: 5.625rem;
}
}
section.section--contact-mail {
padding-bottom: 3.3125rem;
}
section.section--profile-bio {
padding-top: 3rem;
}
@media screen and (min-width: 768px) {
section.section--contact-mail {
padding-bottom: 0;
}
section.section--profile-bio {
padding-top: 3.0625rem;
}
}
@media screen and (min-width: 1199px) {
section.section--contact-mail {
padding-bottom: 1.5625rem;
}
section.section--profile-bio {
padding-top: 5.8125rem;
}
}
section.section--profile-listing {
padding-top: 3.4375rem;
}
@media screen and (min-width: 768px) {
section.section--profile-listing {
padding-top: 4.6875rem;
}
}
@media screen and (min-width: 1199px) {
section.section--profile-listing {
padding-top: 6.25rem;
}
}
section.section--profile-summary {
padding: 3.25rem 0 3.4375rem;
}
@media screen and (min-width: 768px) {
section.section--profile-summary {
padding: 4.5rem 0 0;
}
}
@media screen and (min-width: 1199px) {
section.section--profile-summary {
padding: 6rem 0 1.375rem;
}
}
section.section--generic {
padding: 0.8125rem 0 3.125rem;
}
@media screen and (min-width: 768px) {
section.section--generic {
padding-bottom: 0.3125rem;
}
section.section--generic .container {
padding: 0 6.0625rem;
}
}
@media screen and (min-width: 1320px) {
section.section--generic {
padding: 2.5rem 0;
}
}
section.section--error {
padding: 2.375rem 0 5.1875rem;
}
.egg.about {
color: #3c3c3c;
}
.egg.about h1 {
font-size: 0.9375em;
line-height: normal;
font-weight: 600;
display: inline-block;
margin-bottom: 0.3125rem;
}
.egg.about h2,
.egg.carousel .carousel__item figure {
margin-bottom: 1.375rem;
}
.egg.about h2 {
font-size: 2.25em;
line-height: 1.1111111111;
font-weight: 400;
}
.egg.about p {
font-size: 1em;
line-height: 1.3;
}
@media screen and (min-width: 768px) {
section.section--error {
padding: 12.5625rem 0 11.25rem;
}
.egg.about h1 {
margin-bottom: 0.5625rem;
}
.egg.about h2 {
font-size: 2.625em;
line-height: 1.0476190476;
margin-bottom: 1.1875rem;
}
.egg.about--services h2 {
margin-bottom: 1.0625rem;
}
}
@media screen and (min-width: 1199px) {
.egg.about h1 {
font-size: 1.375em;
margin-bottom: 0.4375rem;
}
.egg.about h2,
.egg.about--services h2 {
margin-bottom: 1.8125rem;
}
.egg.about h2 {
font-size: 4.5em;
line-height: 0.9722222222;
}
.egg.about p {
font-size: 1.25em;
line-height: 1.3;
font-style: normal;
font-weight: 400;
}
}
@media screen and (max-width: 1199px) {
.egg.about--services h2 br {
display: none;
}
}
@media screen and (max-width: 767px) {
.egg.about--profile h1 {
margin-bottom: 0.1875rem;
}
}
@media screen and (min-width: 768px) {
.egg.about--profile h2 {
max-width: 40.625rem;
margin-bottom: 1.0625rem;
}
}
@media screen and (min-width: 1199px) {
.egg.about--profile h2 {
max-width: 69.6875rem;
margin-bottom: 1.8125rem;
}
}
@media screen and (min-width: 1440px) {
section.section--generic .container {
padding: 0;
max-width: 62.7777777778vw;
}
section.section--error {
padding: 9.125rem 0 7.5625rem;
}
.egg.about h1 {
font-size: 1.5277777778vw;
}
.egg.about h2 {
font-size: 5vw;
}
.egg.about p {
font-size: 1.3888888889vw;
}
.egg.about--profile h2 {
max-width: 77.4305555556vw;
}
}
.egg.about--profile p {
margin-right: 0.625rem;
}
.egg.address article {
font-size: 1.25em;
line-height: 1.4;
font-weight: 400;
letter-spacing: 0.0125rem;
text-align: center;
color: #3c3c3c;
margin-bottom: 2.9375rem;
}
.egg.address address {
margin-bottom: 2.5rem;
}
.egg.address .address__map {
height: 16.125rem;
width: 100%;
}
.egg.address .address__map .leaflet-tile {
filter: grayscale(100%);
filter: gray;
}
.egg.address .leaflet-touch .leaflet-bar a {
width: 0.875rem;
height: 0.75rem;
line-height: 0.6875rem;
}
.egg.address .leaflet-touch .leaflet-control-zoom-in,
.egg.address .leaflet-touch .leaflet-control-zoom-out {
font-size: 0.6875rem;
}
.egg.address .leaflet-left .leaflet-control {
margin-left: 0.25rem;
margin-top: 0.0625rem;
}
.egg.address .leaflet-touch .leaflet-bar,
.egg.address .leaflet-touch .leaflet-control-layers {
border-width: 1px;
}
.egg.banner {
position: relative;
height: 100vh;
min-height: 31.25rem;
display: grid;
place-items: center;
}
.egg.banner video {
height: 100%;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
will-change: transform;
}
.egg.banner .banner__card {
z-index: 1;
background-color: #fff;
width: 18.75rem;
height: 18.75rem;
}
.egg.banner figure {
margin-top: 8.4375rem;
margin-bottom: 5.03125rem;
transition: 0.5s ease-in-out;
}
.egg.banner img {
margin: auto;
width: 8.75rem;
}
.egg.banner h1,
.egg.error {
margin: 0 auto;
text-align: center;
}
.egg.banner h1 {
font-size: 0.6875em;
line-height: 1.2;
letter-spacing: 2.2px;
font-weight: 500;
max-width: 14.6875rem;
}
.egg.banner h1 i {
text-transform: lowercase;
font-weight: 500;
letter-spacing: 0.11px;
}
.egg.banner a.banner__scroll {
color: #fff;
text-transform: uppercase;
text-decoration: none;
position: fixed;
bottom: 2.5rem;
left: 50%;
transform: translateX(-50%);
font-size: 0.75rem;
line-height: 1.2;
font-weight: 500;
letter-spacing: 0.075rem;
padding-bottom: 0.3125rem;
border-bottom: 0.0625rem solid #fff;
margin-left: 0.25rem;
}
.egg.carousel .carousel__item h2,
.egg.carousel .carousel__item span {
font-size: 0.75em;
line-height: 1.2791666667;
letter-spacing: 1.2px;
color: #959595;
font-weight: 500;
text-transform: uppercase;
font-family:
freight-display-pro,
Times New Roman,
Times,
serif;
}
.egg.banner .background-img {
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
}
.egg.blocks p+p,
.egg.project-story p+p,
.egg.story p+p {
margin-top: 0.875rem;
}
.egg.blocks p,
.egg.project-story p {
font-size: 0.875em;
line-height: 1.3;
color: #3c3c3c;
}
.egg.blocks figure {
--aspect-ratio: 240/360;
}
@media screen and (min-width: 768px) {
.egg.about--profile p {
max-width: 31.5625rem;
}
.egg.address {
display: -ms-flexbox;
display: flex;
}
.egg.address article {
-ms-flex: 1;
flex: 1;
text-align: left;
font-size: 1.375rem;
line-height: normal;
letter-spacing: normal;
margin-bottom: 0;
}
.egg.address article li {
margin-bottom: -0.0625rem;
}
.egg.address address {
max-width: 50%;
margin-bottom: 6.9375rem;
}
.egg.address .address__map {
height: auto;
width: 48%;
margin: 0.5625rem 0 0.375rem;
}
.egg.banner {
border: 1.875rem solid #fff;
}
.egg.banner .banner__card {
width: 23rem;
height: 23rem;
}
.egg.banner figure {
margin-top: 10.375rem;
margin-bottom: 7.375rem;
}
.egg.banner img {
width: 9.375rem;
}
.egg.banner h1 {
max-width: unset;
}
.egg.banner a.banner__scroll {
bottom: 4.0625rem;
margin-left: 0;
}
.egg.blocks p+p {
margin-top: 1rem;
}
.egg.blocks.blocks--two-col {
display: -ms-flexbox;
display: flex;
gap: 1.875rem;
padding-inline: 0.1875rem;
}
}
@media screen and (min-width: 1199px) {
.egg.about--profile p {
max-width: 47.5rem;
}
.egg.address article {
font-size: 1.875rem;
}
.egg.address address {
max-width: 40%;
margin: 0.3125rem 0 15.75rem;
}
.egg.address .address__map {
width: 48.7%;
margin: 0 0 0.5625rem;
}
.egg.blocks p+p {
margin-top: 1.0625rem;
}
.egg.blocks p {
font-size: 1em;
line-height: 1.3;
}
.egg.blocks.blocks--two-col {
gap: 2.1875rem;
padding-inline: 0;
}
.egg.carousel {
-ms-flex-preferred-size: 50%;
flex-basis: 50%;
max-width: 50%;
cursor: pointer;
}
}
.egg.blocks.blocks--two-col figure:not(:last-of-type) {
margin-bottom: 3.4375rem;
}
.egg.blocks.blocks--text-two-col {
columns: 2;
gap: 3.125rem;
}
@media screen and (min-width: 1320px) {
.egg.banner {
border-width: 2.125rem;
border-bottom: 0;
height: calc(100dvh - 34px);
}
.egg.banner .banner__card {
width: 30rem;
height: 30rem;
margin-top: 2.5rem;
}
.egg.banner figure {
margin-top: 14.125rem;
margin-bottom: 9.5rem;
}
.egg.banner img {
width: 11.25rem;
}
.egg.banner h1 {
font-size: 0.9375rem;
line-height: 1.125rem;
letter-spacing: 0.1875rem;
}
.egg.carousel {
max-width: 41.875rem;
}
}
.egg.carousel .carousel__item span {
margin-right: 3.25rem;
}
.egg.contact .contact__item,
.egg.profile--bio figcaption,
.egg.project-related,
.generic h2 {
text-align: center;
}
.egg.contact .contact__item:not(:last-of-type) {
margin-bottom: 3rem;
}
.egg.contact .contact__item h2 {
color: #3c3c3c;
font-size: 1.25rem;
font-weight: 400;
margin-bottom: 0.75rem;
}
.egg.contact .contact__item a,
.egg.error .l-btn {
font-weight: 500;
display: inline-block;
text-transform: uppercase;
}
.egg.contact .contact__item a {
color: #7e7e7e;
font-size: 0.75rem;
text-decoration: underline;
text-underline-offset: 0.6875rem;
padding-bottom: 0.625rem;
letter-spacing: 0.075rem;
}
.egg.error {
color: #3c3c3c;
padding: 0 1.6875rem;
max-width: 34.375rem;
}
.egg.error h1 {
font-size: 4rem;
font-weight: 400;
line-height: 81.02px;
color: #000;
padding-bottom: 1.875rem;
margin-bottom: 2.8125rem;
}
.egg.error li,
.generic ul li {
list-style: disc;
margin-bottom: 0;
}
.egg.error h1:after {
content: "";
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
height: 0.0625rem;
width: 2.8125rem;
background-color: #d9d9d9;
}
.egg.error li,
.egg.error p {
font-size: 1em;
line-height: 1.3;
}
.egg.error ul {
width: fit-content;
margin-left: auto;
margin-right: auto;
padding-left: 1.3125rem;
}
.egg.error li {
text-align: left;
}
.egg.error p,
.egg.error ul,
.generic figure,
.generic video {
margin-bottom: 1.25rem;
}
.egg.error .l-btn {
font-size: 0.875em;
line-height: 1.2;
letter-spacing: 0.0875rem;
margin-top: 1.25rem;
margin-bottom: 0.375rem;
}
.generic h1,
.generic h2,
.generic h3,
.generic h4,
.generic h5,
.generic h6 {
font-family:
freight-display-pro,
Times New Roman,
Times,
serif;
font-weight: 400;
margin: 0 0 1.25rem;
}
.generic h1 {
font-size: 1.875em;
line-height: 1.3;
}
.generic h2 {
font-size: 1.5em;
line-height: 1.2658333333;
margin-bottom: 0.375rem;
}
.generic h3 {
font-size: 0.875em;
line-height: 1.2792857143;
margin-bottom: 0.75rem;
letter-spacing: 0.09375rem;
text-transform: uppercase;
font-weight: 500;
}
.generic .generic__subtitle {
text-align: center;
color: #7e7e7e;
text-transform: none;
font-size: 1em;
line-height: 1.2;
font-weight: 400;
letter-spacing: normal;
}
.generic header {
margin-bottom: 1.9375rem;
}
.generic h4,
.generic h5,
.generic h6 {
font-size: 0.875em;
line-height: 1.1428571429;
}
.generic li,
.generic p,
.generic time {
font-size: 0.875em;
line-height: 1.3;
font-weight: 400;
}
.egg.services--clients h2,
.generic li,
.generic p {
margin-bottom: 0.875rem;
}
.generic li a,
.generic p a {
text-decoration: underline;
transition: 0.3s ease-in-out;
}
.generic p+h3 {
margin-top: 1.9375rem;
}
.generic ul {
margin-bottom: 0.9375rem;
padding-left: 1.1875rem;
}
.generic ol {
margin-bottom: 1.25rem;
padding-left: 2.5rem;
}
.generic ol li {
list-style: unset;
}
.generic figure img,
.generic video img {
width: 100%;
}
.generic figure figcaption,
.generic video figcaption {
color: #000;
font-size: 1em;
line-height: 1.25;
margin-top: 0.3125rem;
}
.generic p+h1,
.generic p+h2,
.generic p+h4,
.generic p+h5,
.generic p+h6 {
margin-top: 0.625rem;
}
.generic button {
margin-bottom: 1.875rem;
}
.generic a {
text-decoration: underline;
}
.egg.hero figure {
--aspect-ratio: 478/390;
}
.egg.hero figcaption {
position: absolute;
bottom: 0;
padding: 0 0 1.6875rem 2.125rem;
color: #fff;
}
.egg.hero figcaption span {
font-size: 0.9375em;
line-height: 1.2;
}
.egg.hero figcaption h2 {
font-size: 1.625em;
line-height: 1.2661538462;
margin-top: 0.1875rem;
font-weight: 400;
}
.egg.hero--contact figure {
--aspect-ratio: 291/362;
}
@media screen and (min-width: 768px) {
.egg.blocks.blocks--two-col figure:not(:last-of-type) {
margin-bottom: 0;
}
.egg.carousel .carousel__item span {
margin-right: 3.375rem;
}
.egg.contact {
border-top: 0.0625rem solid #d9d9d9;
border-bottom: 0.0625rem solid #d9d9d9;
padding: 1.25rem 0 1.125rem;
display: -ms-flexbox;
display: flex;
}
.egg.contact .contact__item {
width: 50%;
padding: 6.375rem 0 7.0625rem 2rem;
}
.egg.contact .contact__item:first-of-type {
padding-right: 1.75rem;
padding-left: 0;
border-right: 1px solid #d9d9d9;
margin-bottom: 0;
}
.egg.contact .contact__item h2 {
font-size: 1.375rem;
margin-bottom: 0.9375rem;
}
.egg.error h1 {
font-size: 6.25em;
line-height: 1.266;
padding-bottom: 2.4375rem;
}
.egg.error .l-btn {
margin-bottom: 0;
margin-top: 1.8125rem;
padding-bottom: 0.4375rem;
}
.generic h1 {
font-size: 2.25em;
line-height: 1.1111111111;
}
.generic h2 {
font-size: 1.875em;
line-height: 1.266;
margin-bottom: 1.875rem;
}
.generic h3 {
margin-bottom: 0.625rem;
}
.generic li,
.generic p {
line-height: 1.1375rem;
}
.generic time {
font-size: 0.9375em;
line-height: 1.35;
}
.generic p+h3 {
margin-top: 2.5625rem;
}
.generic figure img,
.generic video img {
max-width: 100%;
}
.generic p+h1,
.generic p+h2,
.generic p+h4,
.generic p+h5,
.generic p+h6 {
margin-top: 1.875rem;
}
.egg.hero figure {
--aspect-ratio: 477/834;
}
.egg.hero figcaption {
padding-bottom: 1.625rem;
}
.egg.hero figcaption h2 {
font-size: 2.25em;
line-height: 1.2661111111;
}
.egg.hero--contact figure {
--aspect-ratio: 462/774;
}
}
@media screen and (min-width: 1199px) {
.egg.carousel .carousel__item h2,
.egg.carousel .carousel__item span {
font-size: 0.875em;
line-height: 1.2792857143;
letter-spacing: 1.4px;
}
.egg.carousel .carousel__wrap {
pointer-events: all;
}
.egg.carousel .carousel__item figure {
margin-bottom: 1.25rem;
}
.egg.carousel .carousel__item span {
margin-right: 3.0625rem;
}
.slider-wrapper {
display: -ms-flexbox;
display: flex;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
-ms-flex-pack: justify;
justify-content: space-between;
}
.egg.contact .contact__item {
padding-left: 0;
padding-bottom: 6.8125rem;
}
.egg.contact .contact__item:first-of-type {
padding-right: 0;
}
.egg.contact .contact__item h2 {
font-size: 1.875rem;
margin-bottom: 0.625rem;
}
.egg.contact .contact__item a {
font-size: 0.875rem;
letter-spacing: 0.0875rem;
}
.generic li,
.generic p {
font-size: 1em;
line-height: 1.3;
}
.egg.hero figure {
--aspect-ratio: 783/1372;
}
.egg.hero--contact figure {
--aspect-ratio: 823/1373;
}
}
.egg.hero--services figure {
--aspect-ratio: 290/360;
}
.egg.profile-listing .profile-listing__grid {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
column-gap: 1.25rem;
row-gap: 2.75rem;
}
.egg.profile-listing .profile-listing__item {
width: calc(50% - 10px);
}
.egg.profile .aspect-box {
--aspect-ratio: 228/170;
}
.egg.profile picture {
display: block;
margin-bottom: 0.9375rem;
}
.egg.profile h2 {
font-size: 1.125rem;
color: #3c3c3c;
font-weight: 400;
margin-bottom: 0.375rem;
}
.egg.profile h3 {
font-size: 0.6875rem;
color: #7e7e7e;
font-weight: 500;
letter-spacing: 0.06875rem;
text-transform: uppercase;
}
.egg.profile p {
font-size: 0.875rem;
color: #3c3c3c;
font-weight: 400;
}
.egg.project-card h2,
.egg.project-filter h1 {
font-family:
freight-big-pro,
Times New Roman,
Times,
serif;
color: #3c3c3c;
}
.egg.profile--bio {
border-top: 1px solid #d9d9d9;
border-bottom: 1px solid #d9d9d9;
padding: 3.4375rem 3rem 3.125rem;
}
.egg.profile--bio .aspect-box {
--aspect-ratio: 325/264;
}
.egg.profile--bio picture {
margin-bottom: 2.8125rem;
}
@media screen and (min-width: 768px) {
.egg.hero--services figure {
--aspect-ratio: 407/774;
}
.egg.profile-listing .profile-listing__grid {
column-gap: 1.875rem;
row-gap: 2.6875rem;
}
.egg.profile-listing .profile-listing__item {
width: calc(33.3333333333% - 20px);
}
.egg.profile .aspect-box {
--aspect-ratio: 227/170;
}
.egg.profile picture {
margin-bottom: 1.25rem;
}
.egg.profile h2 {
margin-bottom: 0.4375rem;
}
.egg.profile--bio {
padding: 4.6875rem 0 4.625rem;
}
.egg.profile--bio figure {
display: -ms-flexbox;
display: flex;
}
.egg.profile--bio .aspect-box {
--aspect-ratio: 327/305;
}
.egg.profile--bio picture {
margin-bottom: 0;
width: 39.4%;
}
}
@media screen and (min-width: 1199px) {
.egg.hero--services figure {
--aspect-ratio: 705/1372;
}
.egg.profile-listing .profile-listing__grid {
column-gap: 2.125rem;
row-gap: 5.125rem;
}
.egg.profile-listing .profile-listing__item {
width: calc(33.3333333333% - 22.7px);
}
.egg.profile .aspect-box {
--aspect-ratio: 581/435;
}
.egg.profile picture {
margin-bottom: 2.125rem;
}
.egg.profile h2 {
font-size: 1.5rem;
margin-bottom: 0.5rem;
}
.egg.profile h3 {
font-size: 0.875rem;
letter-spacing: 0.0875rem;
}
.egg.profile--bio {
padding: 6.25rem 0;
}
.egg.profile--bio .aspect-box {
--aspect-ratio: 591/552;
}
.egg.profile--bio picture {
width: 41%;
}
}
.egg.profile--bio h2 {
font-size: 1.5rem;
margin-bottom: 0.25rem;
}
@media screen and (min-width: 768px) {
.egg.profile--bio figcaption {
text-align: left;
padding: 3.875rem 0 0 1.875rem;
width: 60.59%;
}
.egg.profile--bio h2 {
font-size: 1.375rem;
margin-bottom: 0.625rem;
}
}
@media screen and (min-width: 1199px) {
.egg.profile--bio figcaption {
width: 60.73%;
padding: 11.4375rem 0 0 13.375rem;
}
.egg.profile--bio h2 {
font-size: 2rem;
margin-bottom: 0.3125rem;
}
}
@media screen and (min-width: 1440px) {
.egg.about--profile p {
max-width: 52.7777777778vw;
}
.egg.address article,
.egg.contact .contact__item h2,
.generic h2 {
font-size: 2.0833333333vw;
}
.egg.address address {
max-width: 19.5507638889vw;
}
.egg.banner {
border-width: 2.3611111111vw;
}
.egg.banner .banner__card {
width: 33.3333333333vw;
height: 33.3333333333vw;
}
.egg.banner figure {
margin-top: 47.083%;
margin-bottom: 31.66%;
}
.egg.banner img {
width: 12.5vw;
}
.egg.banner h1 {
font-size: 1.0416666667vw;
line-height: normal;
}
.egg.banner a.banner__scroll {
font-size: 0.8333333333vw;
}
.egg.blocks p,
.egg.error li,
.egg.error p,
.generic .generic__subtitle,
.generic figure figcaption,
.generic li,
.generic p,
.generic video figcaption {
font-size: 1.1111111111vw;
}
.egg.carousel .carousel__item h2,
.egg.carousel .carousel__item span,
.egg.contact .contact__item a,
.egg.error .l-btn,
.egg.profile h3,
.generic h3,
.generic h4,
.generic h5,
.generic h6 {
font-size: 0.9722222222vw;
}
.egg.error {
max-width: 38.1944444444vw;
}
.egg.error h1 {
font-size: 6.9444444444vw;
}
.egg.hero figcaption h2,
.generic h1 {
font-size: 2.5vw;
}
.egg.hero figcaption span,
.generic time {
font-size: 1.0416666667vw;
}
.egg.profile h2 {
font-size: 1.6666666667vw;
}
.egg.profile--bio h2 {
font-size: 2.2222222222vw;
}
}
.egg.profile--bio h3 {
margin-bottom: 1.875rem;
}
@media screen and (min-width: 768px) {
.egg.profile--bio h3 {
margin-bottom: 1.75rem;
}
}
@media screen and (min-width: 1199px) {
.egg.profile--bio h3 {
font-size: 0.875rem;
letter-spacing: 0.0875rem;
margin-bottom: 2.5rem;
}
}
@media screen and (min-width: 1440px) {
.egg.profile--bio h3 {
font-size: 0.9722222222vw;
}
}
.egg.profile--bio p {
text-align: left;
font-size: 0.875rem;
}
.egg.project-card figure {
transition: 0.3s ease-in-out;
margin-bottom: 0;
--aspect-ratio: 246/360;
}
.egg.project-card article,
.egg.project-filter .project-filter__dropdowns {
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
justify-content: space-between;
}
.egg.project-card h2 {
font-size: 1.125em;
line-height: 1.2661111111;
font-weight: 400;
}
.egg.project-card .project-card__link {
font-size: 0.75em;
line-height: 1.2;
transition: 0.3s ease-in-out;
padding-right: 1.1875rem;
position: relative;
display: -ms-inline-flexbox;
display: inline-flex;
-ms-flex-align: center;
align-items: center;
margin-top: 0.1875rem;
min-width: 5.625rem;
margin-left: 0.3125rem;
}
.egg.project-card .project-card__link:after {
content: "";
display: block;
position: absolute;
background: url(//eggoffice.com/wp-content/themes/egg-office/images/right-arrow.svg) 0 0 / contain no-repeat;
top: 50%;
right: 0;
transform: translateY(-50%);
width: 0.6875rem;
height: 0.5625rem;
}
.egg.project-filter h1 {
text-align: center;
font-size: 1.5em;
line-height: 1.4583333333;
letter-spacing: 0.29375rem;
font-weight: 500;
text-transform: uppercase;
margin-bottom: 0.75rem;
}
.egg.project-listing .loader__wrapper svg,
.project-filter__dialog .loader__wrapper svg {
width: 10.625rem;
transform-origin: center;
animation: 2s linear infinite a;
margin: 4.375rem auto;
}
.egg.project-filter h1 i {
font-size: 0.96875rem;
line-height: 1.75rem;
letter-spacing: 1.55px;
font-weight: 700;
}
.egg.project-filter .project-filter__filters-btn {
background-color: #fff;
border: 0;
border-bottom: 1.33px solid #7e7e7e;
display: block;
margin: 0 auto;
}
.egg.project-filter .project-filter__dropdowns .project-filter__view-all {
font-size: 0.75em;
line-height: 1.2;
letter-spacing: 1.2px;
color: #3c3c3c;
text-transform: uppercase;
background: 0 0;
border: none;
font-weight: 500;
height: 0.875rem;
}
.project-filter__dialog {
position: fixed;
top: 0;
left: 0;
height: 100dvh;
width: 100vw;
background-color: #fff;
z-index: 99;
border: 0;
padding-top: 5.0625rem;
overflow: auto;
}
.project-filter__dialog .project-filter__close {
color: #3c3c3c;
background: #fff;
border: none;
font-size: 0.625rem;
font-weight: 500;
text-transform: uppercase;
line-height: 0.799375rem;
position: fixed;
right: 0.8125rem;
top: 1.875rem;
letter-spacing: 1.2px;
z-index: 1;
padding: 0.625rem 0.625rem 0.625rem 3.75rem;
}
.egg.project-listing,
.egg.showcase,
.project-filter__dialog .project-filter__select {
position: relative;
}
.project-filter__dialog .loader__wrapper {
display: none;
position: absolute;
top: 90px;
width: 100%;
cursor: progress;
}
.project-filter__dialog .loader__wrapper svg {
display: block;
}
.project-filter__dialog .loader__wrapper circle {
fill: none;
stroke: #d9d9d9;
stroke-width: 2;
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
stroke-linecap: round;
animation: 1.5s ease-in-out infinite b;
}
.project-filter__dialog h2 {
color: #7e7e7e;
font-weight: 400;
padding-bottom: 0.9375rem;
margin-bottom: 1.625rem;
border-bottom: 1px solid #7e7e7e;
}
.project-filter__dialog h2,
.project-filter__dialog ul {
font-size: 0.875em;
line-height: 1.2;
letter-spacing: 1.4px;
text-transform: uppercase;
}
.project-filter__dialog ul {
margin-bottom: 2.8125rem;
color: #3c3c3c;
font-weight: 500;
}
.project-filter__dialog ul:has(.disable-tags),
.project-filter__dialog ul:has(.is-active) {
color: #7e7e7e;
}
.project-filter__dialog ul:last-of-type {
margin-bottom: 3.75rem;
}
.project-filter__dialog ul.disable-filter-list {
cursor: progress;
}
.project-filter__dialog li {
display: -ms-flexbox;
display: flex;
margin-bottom: 0.76875rem;
}
.project-filter__dialog li span {
opacity: 0;
margin-right: 0.625rem;
}
.egg.quick-nav header,
.project-filter__dialog li.is-active {
color: #3c3c3c;
}
.project-filter__dialog li.is-active span {
opacity: 1;
pointer-events: all;
}
.project-filter__dialog li.is-active p {
text-decoration: underline;
text-underline-offset: 0.5rem;
}
.project-filter__dialog li.disable-tags {
color: #d9d9d9;
pointer-events: none;
}
.project-filter__dialog .project-filter__clear {
font-size: 0.875em;
line-height: 1.2;
letter-spacing: 2.8px;
transition: 0.3s ease-in-out;
width: 100%;
height: 2.4375rem;
background-color: #7e7e7e;
color: #fff;
border: 0;
text-transform: uppercase;
margin-bottom: 2.5rem;
}
.project-filter__dialog .project-filter__clear:hover {
background-color: #3c3c3c;
}
.egg.project-listing .project-listing__item {
margin-bottom: 3.4375rem;
-ms-flex-preferred-size: calc(50% - 30px);
flex-basis: calc(50% - 30px);
}
.egg.project-listing .loader__wrapper {
position: absolute;
height: 100%;
width: 100%;
z-index: 1;
-webkit-backdrop-filter: grayscale(1);
backdrop-filter: grayscale(1);
display: none;
transition: 0.3s ease-in-out;
}
.egg.project-listing .loader__wrapper svg {
display: block;
}
.egg.project-listing .loader__wrapper circle {
fill: none;
stroke: #d9d9d9;
stroke-width: 2;
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
stroke-linecap: round;
animation: 1.5s ease-in-out infinite b;
}
@keyframes a {
to {
transform: rotate(1turn);
}
}
@keyframes b {
0% {
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 90, 200;
stroke-dashoffset: -35px;
}
to {
stroke-dashoffset: -125px;
}
}
.egg.project-listing .project-listing__empty {
height: 30vh;
min-height: 13.75rem;
width: 100%;
text-align: center;
}
.egg.project-listing .project-listing__empty p {
font-style: italic;
font-size: 1.125rem;
color: #3c3c3c;
}
.egg.project-listing .l-btn {
display: block;
width: fit-content;
margin: 0 auto;
}
.egg.project-related .l-btn {
display: inline-block;
margin-bottom: 3.4375rem;
padding-bottom: 0.4375rem;
}
.egg.project-related .project-related__title {
font-size: 1.25em;
line-height: 1.25;
font-family:
freight-big-pro,
Times New Roman,
Times,
serif;
font-style: italic;
color: #3c3c3c;
font-weight: 400;
text-align: left;
margin-bottom: 1.875rem;
}
.egg.project-related .project-related__nav {
padding: 1.5rem 0 1.875rem;
border: 1px solid #d9d9d9;
border-inline: 0;
}
.egg.project-related .project-related__nav .project-card+.project-card {
margin-top: 1.875rem;
}
.egg.project-related .project-related__nav .project-card {
width: 100%;
}
.egg.project-story article {
margin-bottom: 3.25rem;
}
.egg.project-story .project-story__services ul:has(~ h2) {
margin-bottom: 2.625rem;
}
.egg.project-story .project-story__services h2 {
font-size: 0.875em;
line-height: 1.2792857143;
letter-spacing: 1.4px;
font-weight: 500;
color: #959595;
text-transform: uppercase;
margin-bottom: 0.1875rem;
}
.egg.project-story .project-story__services li,
.egg.services .services__row .services__col ul li {
font-family:
calibre regular,
system-ui,
Segoe UI,
Roboto,
Helvetica,
Arial,
sans-serif;
font-size: 0.875em;
color: #7e7e7e;
}
.egg.project-story .project-story__services li {
line-height: 1.25;
margin-bottom: 0.21875rem;
}
.egg.quick-nav ul {
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
justify-content: space-between;
margin: 0 0 2.5rem;
padding-bottom: 0.75rem;
border-bottom: 0.0625rem solid #d9d9d9;
}
.egg.quick-nav ul li:first-of-type {
margin-left: 0.5rem;
}
.egg.quick-nav ul li:last-of-type {
margin-right: 0.5rem;
}
.egg.quick-nav ul .quick-nav__home svg {
width: 1.125rem;
height: 1.125rem;
}
.egg.quick-nav header span {
font-size: 0.9375em;
line-height: 1.2826666667;
font-weight: 600;
display: inline-block;
margin-bottom: 0.3125rem;
}
.egg.quick-nav header h2 {
font-size: 2.25em;
line-height: 1.1111111111;
font-weight: 400;
}
.egg.services h2,
.egg.services h3 {
font-size: 1.25em;
line-height: 2;
letter-spacing: 0.25rem;
color: #3c3c3c;
text-align: center;
font-weight: 500;
text-transform: uppercase;
margin: 0 0 0.6875rem;
}
.egg.services .services__row {
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-direction: column;
flex-direction: column;
gap: 3.3125rem;
}
@media screen and (min-width: 740px) {
.egg.services .services__row {
-ms-flex-direction: row;
flex-direction: row;
gap: 0;
}
.egg.services .services__row .services__col {
width: 33.3333333333%;
}
.egg.services .services__row .services__col--one {
transform: translateX(-1.375rem);
}
.egg.services--clients .services__row .services__col {
width: 100%;
}
}
@media screen and (min-width: 768px) {
.egg.project-card figure {
--aspect-ratio: 246/372;
}
.egg.project-card .project-card__link {
font-size: 0.875em;
line-height: 1.2;
padding-right: 1.4375rem;
}
.egg.project-filter h1 {
font-size: 1.5em;
line-height: 1.6666666667;
letter-spacing: 4.8px;
margin-bottom: 1.5rem;
}
.egg.project-filter h1 i {
font-size: 0.875rem;
line-height: 2.1875rem;
letter-spacing: 1.4px;
}
.egg.project-filter .project-filter__filters-btn,
.egg.project-filter h1 br,
.egg.project-listing .l-btn,
.egg.project-related .l-btn {
display: none;
}
.egg.project-filter .project-filter__dropdowns {
max-width: 34.4375rem;
margin: 0 auto;
}
.egg.project-listing .project-listing__grid {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-inline: -0.9375rem;
}
.egg.project-listing .project-listing__item {
margin-bottom: 4.375rem;
margin-inline: 0.9375rem;
}
.egg.project-listing .project-listing__item:nth-last-child(-n + 2) {
margin-bottom: 0;
}
.egg.project-listing .project-listing__empty p {
font-size: 1.5rem;
}
.egg.project-related .project-related__title {
font-size: 1.375em;
line-height: 1.25;
padding-left: 0.0625rem;
margin-bottom: 1.8125rem;
}
.egg.project-related .project-related__nav {
padding: 1.625rem 0 2.4375rem;
}
.egg.project-related .project-related__nav .project-card+.project-card {
margin-top: 0;
}
.egg.project-related .project-related__nav .project-card__link {
padding-right: 1.625rem;
}
.egg.project-related .project-related__nav nav {
display: -ms-flexbox;
display: flex;
gap: 1.875rem;
}
.egg.project-story {
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
justify-content: space-between;
}
.egg.project-story p+p {
margin-top: 1rem;
}
.egg.project-story article {
width: 56.66%;
}
.egg.project-story .project-story__services {
width: 23.1%;
margin-top: 0.125rem;
}
.egg.quick-nav {
display: -ms-flexbox;
display: flex;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-align: end;
align-items: flex-end;
}
.egg.quick-nav ul {
-ms-flex-align: center;
align-items: center;
width: 6.75rem;
max-width: 6.75rem;
margin-bottom: 0.375rem;
padding: 0.625rem 0.6875rem 0.3125rem 0.5rem;
border: 1px solid #d9d9d9;
border-radius: 0.125rem;
}
.egg.quick-nav ul li:first-of-type {
margin-left: 0;
}
.egg.quick-nav ul li:last-of-type {
margin-right: 0;
}
.egg.quick-nav header h2 {
font-size: 2.625em;
line-height: 1.265952381;
}
.egg.services h2,
.egg.services h3 {
font-size: 1.75em;
line-height: 1.4285714286;
letter-spacing: 5.6px;
margin-bottom: 2.1875rem;
}
.egg.services .services__row {
gap: 2.96875rem;
}
}
.egg.showcase h2,
.egg.story h2 {
font-size: 1.5em;
color: #3c3c3c;
font-weight: 500;
text-transform: uppercase;
}
@media screen and (min-width: 830px) {
.egg.services .services__row {
gap: 6.75rem;
}
}
.egg.services .services__row .services__col {
-ms-flex-preferred-size: auto;
flex-basis: auto;
text-align: center;
padding: 0 1.15625rem;
}
.egg.services .services__row .services__col h3 {
display: block;
font-size: 1.25em;
line-height: 1.2;
letter-spacing: 0.25rem;
padding: 0 1.25rem;
margin: 0 0 1.3125rem;
}
.egg.services .services__row .services__col ul li {
line-height: 120%;
}
.egg.services .services__row .services__col ul li:not(:last-of-type) {
margin-bottom: 0.35625rem;
}
@media screen and (min-width: 768px) {
.egg.services .services__row .services__col {
padding: 0;
}
.egg.services .services__row .services__col h3 {
font-size: 1.125em;
line-height: 1;
letter-spacing: 0.225rem;
margin: 0 0 1.25rem;
padding: 0;
}
.egg.services .services__row .services__col ul li {
line-height: 150%;
}
.egg.services .services__row .services__col ul li:not(:last-of-type) {
margin-bottom: 0.34375rem;
}
.egg.services--clients {
padding-bottom: 3.6875rem;
border-bottom: 1px solid #d9d9d9;
}
}
@media screen and (min-width: 1320px) {
.egg.services--clients {
padding-bottom: 8.625rem;
}
}
.egg.services--clients .services__row {
display: block;
}
.egg.services--clients .services__row .services__col {
text-align: left;
padding: 0 0.70625rem;
}
@media screen and (min-width: 600px) {
.egg.services--clients .services__row .services__col {
text-align: center;
}
}
.egg.services--clients .services__row .services__col ul {
column-gap: 2.0625rem;
column-count: 2;
}
.egg.services--clients .services__row .services__col ul li:not(:last-of-type) {
margin-bottom: 0.453125rem;
}
.egg.showcase .l-card-link {
margin-top: 4.375rem;
height: 80%;
}
.egg.showcase h2 {
line-height: 1.4583333333;
letter-spacing: 4.8px;
text-align: center;
margin: 0 0 2.3125rem 0.1875rem;
}
.egg.showcase ul {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-pack: center;
justify-content: center;
-ms-flex-align: center;
align-items: center;
margin-inline: -0.9375rem;
}
.egg.showcase ul li {
margin-inline: 1.5rem;
margin-bottom: 2.6875rem;
max-width: 6.875rem;
max-height: 3.625rem;
}
.egg.showcase ul img {
margin: 0 auto;
max-width: 90%;
}
.egg.story {
text-align: center;
padding: 0 3.5rem;
}
.egg.story h2 {
line-height: 1.15;
letter-spacing: 0.29375rem;
margin-bottom: 1.4375rem;
}
.egg.story h2 i {
font-size: 0.875rem;
line-height: 1.75rem;
letter-spacing: 1.2px;
font-weight: 700;
}
.egg.story p {
max-width: 41.375rem;
margin: 0 auto;
font-size: 0.875em;
line-height: 1.3;
font-family:
calibre regular,
system-ui,
Segoe UI,
Roboto,
Helvetica,
Arial,
sans-serif;
}
.egg.story p:last-of-type {
margin-bottom: 1.5625rem;
}
.egg.story--slider {
margin-bottom: 6.75rem;
}
@media screen and (min-width: 768px) {
.egg.services--clients h2 {
font-size: 1.125em;
line-height: 2.2222222222;
letter-spacing: 0.225rem;
margin-bottom: 0.8125rem;
}
.egg.showcase h2,
.egg.story h2 {
font-size: 1.75em;
letter-spacing: 5.6px;
}
.egg.services--clients .services__row .services__col {
padding: 0;
transform: translateX(-0.3125rem);
}
.egg.services--clients .services__row .services__col ul {
column-count: 3;
column-gap: 3.125rem;
}
.egg.services--clients .services__row .services__col ul li {
line-height: 100%;
}
.egg.services--clients .services__row .services__col ul li:not(:last-of-type) {
margin-bottom: 0.90625rem;
}
.egg.showcase h2 {
line-height: 1.4285714286;
margin-bottom: 2.1875rem;
}
.egg.showcase ul {
margin-inline: -1.625rem;
}
.egg.showcase ul li {
margin-inline: 1.625rem;
margin-bottom: 2.8125rem;
max-width: 10.5rem;
max-height: 4.375rem;
}
.egg.showcase ul img {
width: auto;
max-width: 76%;
}
.egg.story h2 {
line-height: 1.25;
margin-bottom: 1.875rem;
margin-left: 0.25rem;
}
.egg.story h2 i {
font-size: 1rem;
line-height: 2.1875rem;
letter-spacing: 1.6px;
}
.egg.story h2 br {
display: none;
}
.egg.story p {
padding-inline: 2.8125rem;
}
.egg.story p:last-of-type {
margin-bottom: 2.25rem;
}
.egg.story p+p {
margin-top: 1rem;
}
.egg.story--slider {
margin-bottom: 9.8125rem;
}
}
@media screen and (min-width: 1199px) {
.egg.profile--bio p {
font-size: 1rem;
max-width: 25.625rem;
}
.egg.project-card:hover figure {
opacity: 0.7;
}
.egg.project-card:hover .project-card__link {
opacity: 1;
}
.egg.project-card figure {
--aspect-ratio: 446/668;
margin-bottom: 0;
}
.egg.project-card h2 {
font-size: 1.5em;
line-height: 1.2658333333;
}
.egg.project-card .project-card__link {
font-size: 1.125em;
line-height: 1.2;
padding-right: 1.4375rem;
opacity: 0;
}
.egg.project-filter h1 {
line-height: 1.25;
letter-spacing: 6.4px;
margin-bottom: 2.875rem;
font-size: 2.2222222222vw;
}
.egg.project-filter h1 i,
.egg.story h2 i {
font-size: 1.25rem;
line-height: 1.6rem;
letter-spacing: 2px;
}
.egg.project-filter .project-filter__dropdowns {
max-width: 41.6875rem;
}
.egg.project-filter .project-filter__dropdowns .project-filter__view-all {
line-height: 1.2;
letter-spacing: 1.4px;
font-size: 0.9722222222vw;
}
.egg.project-listing .project-listing__grid {
margin-inline: -1.0625rem;
}
.egg.project-listing .project-listing__item {
-ms-flex-preferred-size: calc(50% - 35px);
flex-basis: calc(50% - 35px);
margin-inline: 1.0625rem;
margin-bottom: 4rem;
}
.egg.project-related .project-related__title {
font-size: 1.75em;
line-height: 1.25;
padding-left: 0;
margin-bottom: 1.25rem;
}
.egg.project-related .project-related__nav {
padding-bottom: 2.6875rem;
}
.egg.project-related .project-related__nav nav {
gap: 2.1875rem;
}
.egg.project-story p {
font-size: 1em;
line-height: 1.3;
}
.egg.project-story p+p {
margin-top: 1.0625rem;
}
.egg.project-story article {
width: 40.5%;
}
.egg.project-story .project-story__services ul:has(~ h2) {
margin-bottom: 3.8125rem;
}
.egg.project-story .project-story__services li {
margin-bottom: 0.1875rem;
font-size: 1em;
line-height: 1.25;
}
.egg.quick-nav ul {
width: 8.375rem;
max-width: 8.375rem;
padding: 0.6875rem 0.875rem 0.5rem 0.75rem;
margin-bottom: 1.5625rem;
}
.egg.quick-nav .quick-nav__back svg,
.egg.quick-nav .quick-nav__forward svg {
width: 1.0625rem;
height: 1.0625rem;
}
.egg.quick-nav header span {
font-size: 1.375em;
line-height: 1.2831818182;
}
.egg.quick-nav header h2 {
font-size: 5em;
line-height: 1.266;
margin-top: -0.6875rem;
}
.egg.services .services__row .services__col h3 {
font-size: 1.875em;
line-height: 1.2;
letter-spacing: 0.375rem;
margin: 0 0 1.375rem;
}
.egg.services .services__row .services__col ul li {
font-size: 1em;
}
.egg.services .services__row .services__col ul li:not(:last-of-type) {
margin-bottom: 0.3375rem;
}
.egg.services--clients h2 {
font-size: 1.875em;
line-height: 1.3333333333;
letter-spacing: 0.375rem;
margin: 0 0 2.75rem 0.3125rem;
}
.egg.showcase h2,
.egg.story h2 {
font-size: 2em;
line-height: 1.25;
letter-spacing: 6.4px;
}
.egg.services--clients .services__row {
padding: 0 5.25rem;
}
.egg.services--clients .services__row .services__col ul {
column-gap: 7.875rem;
padding-right: 0;
}
.egg.services--clients .services__row .services__col ul li {
line-height: 150%;
}
.egg.services--clients .services__row .services__col ul li:not(:last-of-type) {
margin-bottom: 0.375rem;
}
.egg.showcase .l-card-link {
height: 70%;
}
.egg.showcase h2 {
margin-bottom: 2.3125rem;
}
.egg.showcase ul {
margin-inline: -2.5rem;
}
.egg.showcase ul li {
margin-inline: 2.5rem;
margin-bottom: 5rem;
max-width: 18.1875rem;
max-height: 5.6875rem;
transform: none;
}
.egg.showcase ul img {
max-width: 100%;
}
.egg.story h2 {
margin-bottom: 2.0625rem;
margin-left: 0;
}
.egg.story p {
font-size: 1em;
line-height: 1.3;
padding-inline: 0;
}
.egg.story p:last-of-type {
margin-bottom: 2.375rem;
}
.egg.story--slider {
-ms-flex-preferred-size: 50%;
flex-basis: 50%;
text-align: left;
margin-top: 8.625rem;
margin-bottom: 0;
padding: 0 3.125rem;
}
.egg.story--slider article {
max-width: 29.4444444444vw;
margin: 0 auto;
}
}
@media screen and (min-width: 1441px) {
.egg.banner {
border-bottom: 0.9722222222vw solid #fff;
}
.egg.banner a.banner__scroll {
bottom: 4.6875rem;
}
.egg.carousel {
max-width: 50%;
}
.egg.story--slider {
padding-left: 1.875rem;
}
}
.egg.story--slider h2 {
color: #000;
margin-bottom: 1.375rem;
letter-spacing: 0.3125rem;
}
@media screen and (max-width: 767px) {
.egg.project-filter .project-filter__dropdowns {
display: none;
}
.egg.project-listing .project-listing__item:last-child {
margin-bottom: 3.25rem;
}
.egg.project-story .project-story__services {
padding: 2.9375rem 0 2.5625rem;
border: 1px solid #d9d9d9;
border-inline: 0;
}
}
@media screen and (min-width: 768px) {
.egg.story--slider h2 {
margin-bottom: 1.9375rem;
}
.egg.story--slider h2 br {
display: block;
}
}
@media screen and (min-width: 1199px) {
.egg.story--slider h2 {
margin-bottom: 2.3125rem;
max-width: 17.5rem;
}
}
@media screen and (min-width: 1440px) {
.egg.profile--bio p {
font-size: 1.1111111111vw;
max-width: 28.4722222222vw;
}
.egg.project-card h2 {
font-size: 1.6666666667vw;
}
.egg.project-card .project-card__link:after {
width: 0.7638888889vw;
height: 0.625vw;
}
.egg.project-card .project-card__link {
font-size: 1.25vw;
padding-right: 1.3194444444vw;
}
.egg.project-filter .project-filter__dropdowns {
max-width: 46.3194444444vw;
}
.egg.project-related .project-related__title {
font-size: 1.9444444444vw;
}
.egg.project-story .project-story__services li,
.egg.project-story p {
font-size: 1.1111111111vw;
}
.egg.project-story .project-story__services h2 {
font-size: 0.9722222222vw;
}
.egg.services .services__row {
padding: 0 7.3125rem;
gap: calc(12.2125rem - 1vw);
}
.egg.services .services__row .services__col h3,
.egg.services--clients h2 {
font-size: 2.0833333333vw;
}
.egg.services .services__row .services__col ul {
padding-right: 0.5625rem;
}
.egg.services .services__row .services__col ul li,
.egg.story p {
font-size: 1.1111111111vw;
}
.egg.showcase h2,
.egg.story h2 {
font-size: 2.2222222222vw;
}
.egg.story h2 i {
font-size: 1.3888888889vw;
}
.egg.story--slider h2 {
max-width: 19.4444444444vw;
}
}
.egg.summary {
border-top: 1px solid #d9d9d9;
border-bottom: 1px solid #d9d9d9;
}
.egg.summary blockquote {
padding: 2.8125rem 3rem 2.9375rem;
text-align: center;
}
.egg.summary p {
font-size: 1em;
line-height: 1.25;
font-family:
freight-big-pro,
Times New Roman,
Times,
serif;
color: #3c3c3c;
font-style: italic;
font-weight: 400;
}
@media screen and (min-width: 768px) {
.egg.story--slider p {
font-size: 0.875em;
line-height: 1.3;
}
.egg.summary blockquote {
padding: 2.75rem 8.25rem;
}
.egg.summary p {
font-size: 1.125em;
line-height: 1.25;
}
}
@media screen and (min-width: 1199px) {
.egg.story--slider h2 br {
display: none;
}
.egg.story--slider p {
font-size: 1em;
line-height: 1.3;
max-width: 100%;
padding: 0;
}
.egg.summary blockquote {
padding: 4.125rem 14.25rem;
}
.egg.summary p {
font-size: 1.75em;
line-height: 1.25;
}
}
@media screen and (min-width: 1440px) {
.egg.story--slider p {
font-size: 1.1111111111vw;
}
.egg.summary p {
font-size: 1.9444444444vw;
}
} .aspect-box.is-vimeo {
background-color: #000;
}
.egg .aspect-box.is-vimeo {
--aspect-ratio: 9/16;
}
.egg.blocks:has(.is-vimeo) .aspect-box {
--aspect-ratio: 9/16;
}
@media screen and (max-width: 600px) {
.egg .aspect-box.is-vimeo.is-mobile {
--aspect-ratio: 16/9;
}
}
.aspect-box iframe {
pointer-events: none;
}
.hero-vimeo--mobile {
display: none;
}
@media(max-width:600px) {
.hero-vimeo--desktop {
display: none;
}
.hero-vimeo--mobile {
display: block;
}
}
@media screen and (min-width: 768px) {
.egg.project-card figure.aspect-box {
--aspect-ratio: 9/16;
}
}
.egg.blocks,
.egg.project-card .project-card__media,
.egg.hero {
overflow: hidden;
}
.egg.blocks .aspect-box,
.egg.project-card .aspect-box,
.egg.hero .aspect-box {
transform: scale(1.01) translateZ(0);
transform-origin: center;
backface-visibility: hidden;
}
.aspect-box iframe,
.aspect-box video,
.egg.banner video,
.egg.banner iframe  {
backface-visibility: hidden;
filter: blur(0);
transform: translateZ(0);
}
.egg.project-card .project-card__media{
margin-bottom: 0.875rem;
}
@media screen and (min-width: 1199px) {
.egg.project-card .project-card__media {
margin-bottom: 1.1875rem;
}
}
.egg.blocks .blocks__media {
flex: 1;
overflow: hidden;
}
.aspect-box.is-vimeo:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 10;
}
@media screen and (max-width: 767px) {
.egg.blocks--two-col .blocks__media:not(:first-child) {
margin-top: 30px;
}
}.slick-slider{box-sizing:border-box;-webkit-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list,.slick-slider{position:relative;display:block}.slick-list{overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:none}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-list,.slick-slider .slick-track{transform:translateZ(0)}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto}.slick-track:after,.slick-track:before{display:table;content:""}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir=rtl] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}