html {
scroll-behavior: smooth;
}
@font-face {
font-family: "CopperplateGothicStd-31BC";
src: url(//tr-architects.com/wp-content/themes/thompson-raissis/css/webfonts/copperplate/2B7C79_8_0.eot);
src: url(//tr-architects.com/wp-content/themes/thompson-raissis/css/webfonts/copperplate/2B7C79_8_0.eot?#iefix) format("embedded-opentype"), url(//tr-architects.com/wp-content/themes/thompson-raissis/css/webfonts/copperplate/2B7C79_8_0.woff) format("woff"), url(//tr-architects.com/wp-content/themes/thompson-raissis/css/webfonts/copperplate/2B7C79_8_0.ttf) format("truetype");
}
@font-face {
font-family: "Copperplate-Bol";
src: url(//tr-architects.com/wp-content/themes/thompson-raissis/css/webfonts/copperplate/2E2EE7_0_0.eot);
src: url(//tr-architects.com/wp-content/themes/thompson-raissis/css/webfonts/copperplate/2E2EE7_0_0.eot?#iefix) format("embedded-opentype"), url(//tr-architects.com/wp-content/themes/thompson-raissis/css/webfonts/copperplate/2E2EE7_0_0.woff2) format("woff2"), url(//tr-architects.com/wp-content/themes/thompson-raissis/css/webfonts/copperplate/2E2EE7_0_0.woff) format("woff"), url(//tr-architects.com/wp-content/themes/thompson-raissis/css/webfonts/copperplate/2E2EE7_0_0.ttf) format("truetype");
}
html {
color: #222;
font-size: 16px;
line-height: 1.4;
}
@media screen and (max-width: 641px) {
html {
font-size: 14px;
}
}
::-moz-selection {
background: #b3d4fc;
text-shadow: none;
}
::selection {
background: #b3d4fc;
text-shadow: none;
}
img::-moz-selection {
background: transparent;
text-shadow: none;
}
img::selection {
background: transparent;
text-shadow: none;
}
img::-moz-selection {
background: transparent;
text-shadow: none;
}
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 1em 0;
padding: 0;
}
audio,
canvas,
iframe,
img,
svg,
video {
vertical-align: middle;
}
fieldset {
border: 0;
margin: 0;
padding: 0;
}
textarea {
resize: vertical;
}
.browserupgrade {
margin: 0.2em 0;
background: #ccc;
color: #000;
padding: 0.2em 0;
} body {
font-family: "Open Sans", sans-serif;
font-weight: 300;
color: #000;
}
a {
color: inherit;
text-decoration: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
outline: 0;
}
a:hover {
color: black !important;
cursor: pointer;
}
a:focus {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
outline: 0;
}
.page-template-page_contact a:hover {
opacity: 0.65;
filter: alpha(opacity=65);
}
.contact-image {
-webkit-animation: fadeOutHalf 3s 1s forwards;
animation: fadeOutHalf 3s 1s forwards;
}
@keyframes fadeOutHalf {
0% {
opacity: 1;
}
100% {
opacity: 0.5;
}
}
@-webkit-keyframes fadeOutHalf {
0% {
opacity: 1;
}
100% {
opacity: 0.5;
}
}
.contact-text {
text-transform: uppercase;
opacity: 1; }
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
#tr {
display: block;
position: relative;
width: 0;
height: 2.75rem;
margin: 0.4rem 0;
color: #fff;
}
#tr svg {
padding-top: 0.9rem;
}
@media screen and (min-width: 756px) {
#tr svg {
padding-top: 0.6rem;
}
}
.page-template-page_home #tr {
-webkit-animation: none;
animation: none;
}
.page-template-page_home .heart-slideshow {
height: 100%;
}
.home-text-container,
.blog h2,
.single h1 {
position: absolute;
bottom: 1.5rem;
left: 50%;
color: #fff;
transform: translateX(-50%);
font-size: 2rem;
font-weight: 300;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}
.home-text-container {
font-size: 1.6rem;
}
.home-text-container {
text-align: center;
}
.home-text-container p {
margin: 0;
}
.home-text-container p:last-of-type {
font-size: 0.9rem;
font-weight: 400;
margin: 1rem auto 0;
}
@media screen and (pointer: course) {
.home-text-container {
bottom: 3rem;
}
}
@media screen and (min-width: 614px) {
.home-text-container {
font-size: 2rem;
max-width: 9em;
text-align: center;
}
}
@media screen and (min-width: 756px) {
.home-text-container,
.blog h2,
.single h1 {
font-size: 2.7rem;
}
} .no-cssanimations #tr {
height: 2.75rem !important;
min-width: 2rem !important;
width: 2rem !important;
opacity: 1 !important;
filter: alpha(opacity=100) !important;
display: inline-block !important;
}
.no-cssanimations .centertext {
position: relative !important;
-webkit-transform: none !important;
transform: none !important;
left: auto;
right: auto;
top: auto;
margin: 6rem auto;
opacity: 1 !important;
filter: alpha(opacity=100) !important;
}
.no-cssanimations .page-template-page_contact .centertext.contact-text {
margin: 16rem auto 0;
-webkit-animation: none !important;
animation: none !important;
-webkit-transform: none !important;
transform: none !important;
left: auto;
right: auto;
top: auto;
}
.no-cssanimations .full {
max-height: 5000rem;
height: auto;
padding: 1rem 0;
position: relative;
display: block;
} @keyframes logoAnimation {
0% {
max-width: 0;
}
100% {
max-width: 2rem;
}
}
@-webkit-keyframes logoAnimation {
0% {
max-width: 0;
}
100% {
max-width: 2rem;
}
}
.home #tr,
.tucked #tr {
width: 12.7rem;
}
#site-navigation {
text-align: center;
position: fixed;
background: #fff;
z-index: 999999999;
width: 100%;
top: 0;
height: 5rem;
color: #bbb;
}
#site-navigation ul li {
text-align: center;
font-size: 0.8rem;
line-height: 1;
padding: 0 4px;
}
@media screen and (min-width: 800px) {
#site-navigation .menu-wrapper {
padding-top: 0.5rem;
}
#site-navigation .menu-left-menu-container {
margin-right: 1.5rem;
}
#site-navigation .menu-right-menu-container {
margin-left: 1.5rem;
}
#site-navigation ul li {
padding: 0 1.2vw;
font-size: 0.75rem;
letter-spacing: 0.15rem;
}
}
@media screen and (min-width: 850px) {
#site-navigation .menu-wrapper {
padding-top: 0.5rem;
}
#site-navigation .menu-left-menu-container {
margin-right: 3rem;
}
#site-navigation .menu-right-menu-container {
margin-left: 3rem;
}
#site-navigation ul li {
padding: 0 1.2vw;
font-size: 0.75rem;
letter-spacing: 0.15rem;
}
}
@media screen and (min-width: 1000px) {
#site-navigation .menu-left-menu-container {
margin-right: 6rem;
}
#site-navigation .menu-right-menu-container {
margin-left: 6rem;
}
}
nav div,
nav div ul,
nav div ul li,
nav div ul li:visited {
display: inline-block;
text-transform: uppercase;
color: #bbb;
color: #868288;
}
nav div ul li:hover {
color: #999;
}
nav div ul li.current-menu-item,
nav div ul li:visited.current-menu-item {
color: black;
}
nav .title {
color: #000;
display: none;
text-transform: uppercase;
letter-spacing: 1px;
text-align: center;
font-size: 0.9rem;
}
.page-template-page_home nav .title {
position: fixed;
z-index: 99999999;
pointer-events: none;
top: 1.2rem;
width: 100%; filter: alpha(opacity=0);
-webkit-transition: opacity 0.35s, filter 0.35s;
-webkit-transition: opacity 0.35s, -webkit-filter 0.35s;
transition: opacity 0.35s, -webkit-filter 0.35s;
transition: opacity 0.35s, filter 0.35s;
transition: opacity 0.35s, filter 0.35s, -webkit-filter 0.35s;
}
@media screen and (max-width: 520px) {
.page-template-page_home nav .title {
width: 98%;
}
}
@media screen and (max-width: 420px) {
.page-template-page_home nav .title {
width: 95%;
}
}
@media screen and (max-width: 340px) {
.page-template-page_home nav .title {
width: 90%;
}
}
.menu-toggle {
display: none;
}
button {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
button:focus {
outline: 0;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
@media screen and (max-width: 799.99px) {
.menu-toggle {
position: fixed;
top: 1.4rem;
right: 1rem;
z-index: 999999;
width: 2rem;
height: 2rem;
display: block;
border: none;
background: none;
}
.menu-icon-middle-1,
.menu-icon-middle-2 {
-webkit-transform: rotate(0deg) translate(0, 0);
transform: rotate(0deg) translate(0, 0);
transform-origin: 13px 13px;
-webkit-transform-origin: 13px 13px;
-moz-transform-origin: 13px 13px;
-ms-transform-origin: 13px 13px;
-webkit-transition: all 0.25s;
transition: all 0.25s;
}
.toggled .menu-icon-middle-1 {
transform-origin: 13px 13px;
-moz-transform-origin: 13px 13px;
-webkit-transform-origin: 13px 13px;
-ms-transform-origin: 13px 13px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.toggled .menu-icon-middle-2 {
transform-origin: 13px 13px;
-moz-transform-origin: 13px 13px;
-webkit-transform-origin: 13px 13px;
-ms-transform-origin: 13px 13px;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.menu-icon-top,
.menu-icon-bottom {
-webkit-transform: translateY(0px);
transform: translateY(0px);
-webkit-transition: all 0.5s;
transition: all 0.5s;
}
.toggled .menu-icon-top,
.toggled .menu-icon-bottom {
-webkit-transition: all 0s;
transition: all 0s;
}
.toggled .menu-icon-top {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
.toggled .menu-icon-bottom {
-webkit-transform: translateY(30px);
transform: translateY(30px);
}
#site-navigation .menu-left-menu-container,
#site-navigation .menu-right-menu-container,
#site-navigation .menu-left-menu-container ul,
#site-navigation .menu-right-menu-container ul {
display: none;
opacity: 0;
filter: alpha(opacity=0);
}
#site-navigation.toggled .menu-left-menu-container,
#site-navigation .menu-right-menu-container {
display: block;
opacity: 1;
filter: alpha(opacity=100);
text-align: center;
position: relative;
z-index: 999;
width: 100%;
background: #fff;
color: #bbb;
}
#site-navigation.toggled .menu-left-menu-container {
margin-top: 3.9rem;
padding-top: 0.6rem;
}
#site-navigation.toggled .menu-right-menu-container {
padding-bottom: 1rem;
}
#site-navigation.toggled .menu-left-menu-container ul,
#site-navigation .menu-left-menu-container ul,
#site-navigation .menu-left-menu-container ul li,
#site-navigation .menu-left-menu-container ul li {
position: relative;
width: auto;
margin: 0 auto;
}
#site-navigation a#tr {
text-align: center;
position: fixed;
left: 0;
right: 0;
top: 0;
margin: 0.55rem auto;
}
#site-navigation.toggled ul {
display: block;
opacity: 1;
filter: alpha(opacity=100);
height: auto;
}
#site-navigation.toggled ul li {
display: block;
width: 4.5em;
font-size: 1.15rem;
line-height: 2.5;
text-align: center;
margin: -0.1rem auto;
}
}
#scroll-instruct {
position: absolute;
bottom: 0.35rem;
z-index: 100;
text-align: center;
margin: 0 auto;
left: 0;
right: 0;
text-transform: uppercase;
color: #999;
font-size: 0.9em;
-webkit-transition: opacity 0.3s;
transition: opacity 0.3s;
}
.full-width {
width: 100%;
}
.full {
min-height: calc(100vh - 56px);
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-flex-align: center;
-ms-flex-align: center;
align-items: center;
margin-top: 56px;
}
.home .full {
margin-top: 0;
min-height: 100vh;
}
.touch .full {
height: auto;
position: relative;  }
@media all and (max-width: 641px) {
.full {
max-height: 5000rem;
height: auto;
padding: 1rem 0;
position: relative;
display: block;
}
.touch #home.full {
height: 100vh;
height: 100svh;
min-height: 100vh;
min-height: 100svh;
}
.no-touch .full {
min-height: 100vh;
min-height: 100svh;
}
.black {
position: relative;
display: block;
min-height: 5rem !important;
}
}
.full .slideshow-holder {
position: absolute;
top: 4rem;
bottom: 0;
left: 0;
right: 0;
z-index: -1;
overflow-x: hidden;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
}
@media screen and (max-width: 641px) { }
.img-holder {
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
opacity: 0;
filter: alpha(opacity=0);
-webkit-transition: opacity 1s;
transition: opacity 1s;
opacity: 1;
filter: alpha(opacity=100);
}
.slideshow {
width: 100%;
height: 100%;
overflow: hidden;
}
.slideshow {
opacity: 1;
filter: alpha(opacity=100);
}
.slideshow .slide {
width: 100%;
height: 100%;
background-position: center;
}
.slideshow .slide .img-holder {
opacity: 0;
filter: alpha(opacity=0);
height: 100%;
width: 100%;
background-size: cover;
background-position: center;
-webkit-transition: opacity 0.5s, filter 0.5s;
-webkit-transition: opacity 0.5s, -webkit-filter 0.5s;
transition: opacity 0.5s, -webkit-filter 0.5s;
transition: opacity 0.5s, filter 0.5s;
transition: opacity 0.5s, filter 0.5s, -webkit-filter 0.5s;
}
.slideshow .slide .img-holder.loaded {
opacity: 1;
filter: alpha(opacity=100);
}
.full .img-holder {
filter: alpha(opacity=0);
-webkit-transition: opacity 0.5s, filter 0.5s;
-webkit-transition: opacity 0.5s, -webkit-filter 0.5s;
transition: opacity 0.5s, -webkit-filter 0.5s;
transition: opacity 0.5s, filter 0.5s;
transition: opacity 0.5s, filter 0.5s, -webkit-filter 0.5s;
}
.full .img-holder.loaded {
opacity: 1;
filter: alpha(opacity=100);
}
.project-label {
color: #888;
font-family: "CopperplateGothicStd-31BC";
text-transform: uppercase;
text-align: center;
margin: 0.75em 0 2.25em;
widows: 3;
}
.project-label .project-description-container p {
text-transform: none;
line-height: 2;
}
.project-label span {
font-size: 0.8em;
}
.gallery-button,
.gallery-button-open,
.gallery-button-close {
font-family: "Open Sans", sans-serif;
font-weight: 300;
font-size: 0.9em;
color: #b88c1d;
cursor: pointer;
display: block;
}
.gallery-holder {
opacity: 0;
margin: 0 2rem;
overflow: hidden;
-webkit-transition: all 0.5s;
transition: all 0.5s;
height: 0;
}
.gallery-holder.view-gallery {
opacity: 1;
-webkit-transition: none;
transition: none;
}
@media screen and (max-width: 641px) {
.gallery-holder {
margin: 0 1rem;
}
}
.project-label .project-description-container.text {
max-width: 705px;
width: 93%;
}
.row.intro {
width: 100%;
font-size: 4px;
margin-bottom: 0;
background-color: #efefef;
}
.intro .ratio {
padding-top: 0 !important;
}
@media screen and (min-width: 641px) {
.row.intro {
margin-bottom: 1rem;
}
}
.row {
margin-bottom: 1rem;
}
.row .img-holder {
display: inline-block;
position: relative;
width: 100%; }
.row .img-holder.image-loaded {
opacity: 1;
}
.row .img-holder:after {
content: " ";
position: absolute;
left: -0.5em;
top: 0;
bottom: 0;
width: 1em;
background: white;
}
.row .img-holder:first-child:after {
display: none;
}
.row .img-holder .ratio[style*="padding-top:"] img {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
}
.row .img-holder img {
width: 100%;
background-color: #efefef;
}
.row .img-holder img[src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7']
{
height: 22.5vw;
}
.row.intro .img-holder {
display: none;
}
@media screen and (min-width: 641px) {
.row.has-multi-imgs {
display: flex;
}
.row.intro .img-holder {
display: inline-block;
}
}
@media screen and (max-width: 641px) {
.row:not(.intro) .img-holder {
display: block;
min-width: 100%;
margin-bottom: 1rem;
}
.row .img-holder:after {
display: none;
}
}
.full #logo {
position: absolute;
bottom: 10%;
max-width: 100%;
margin: 0 auto;
left: 0;
right: 0;
text-align: center;
text-indent: -9999px;
background-image: url(//tr-architects.com/wp-content/themes/thompson-raissis/img/lockup.svg);
background-repeat: no-repeat;
background-position: center center;
height: 20%;
min-height: 10rem;
opacity: 0;
filter: alpha(opacity=0);
-webkit-transition: opacity 1.25s 1s, filter 1s 0.5s;
-webkit-transition: opacity 1.25s 1s, -webkit-filter 1s 0.5s;
transition: opacity 1.25s 1s, -webkit-filter 1s 0.5s;
transition: opacity 1.25s 1s, filter 1s 0.5s;
transition: opacity 1.25s 1s, filter 1s 0.5s, -webkit-filter 1s 0.5s;
}
#logo.loaded {
opacity: 1;
filter: alpha(opacity=100);
}
.project-strip {
display: none;
}
.text {
z-index: 9;
width: 80%;
max-width: 1000px;
font-size: 1.075rem;
line-height: 1.65em;
}
@media screen and (max-width: 641px) {
.text {
width: 90%;
font-size: 1.2em;
line-height: 1.5em;
}
.page-template-page_project .text {
width: 95%;
}
.full .img-holder {
height: 100%;
}
.black .text img {
width: 100%;
}
}
.text strong {
text-align: center;
width: 100%;
text-transform: uppercase;
font-weight: 300;
display: block;
}
.centered {
text-align: center;
}
.black {
position: relative;
background: black;
color: #888;
padding-bottom: 5em;
}
.centertext {
position: relative;
-wekit-transform: none;
-webkit-transform: none;
transform: none;
left: auto;
right: auto;
top: auto;
margin: 5rem 5% 1rem;
}
.page-template-page_about .centertext {
margin: 5rem 5% 3rem;
}
.page-template-page_contact .centertext {
text-align: center;
}
.page-template-page_contact .centertext p {
margin: 4rem 0;
}
.touch .centertext {
margin: 0px auto 0;
display: block;
padding: 100px 0 50px;
}
.touch .page-template-page_about .centertext,
.touch .page-template-page_services .centertext {
padding: 0;
}
@media screen and (min-width: 641px) {
.touch .centertext {
left: auto;
top: auto;
position: relative;
-webkit-transform: translate(0%, 0%);
transform: translate(0%, 0%);
margin: 0 auto;
}
}
@media screen and (max-height: 700px) {
.centertext {
position: relative !important;
-wekit-transform: none !important;
-webkit-transform: none !important;
transform: none !important;
left: 0 !important;
top: 0 !important;
margin: 5rem auto 2rem !important;
}
.no-touch .full {
max-height: 5000rem;
height: auto;
padding: 1rem 0;
position: relative;
display: block;
}
.black.full {
max-height: 5000rem;
height: auto;
padding: 1rem 0 3rem;
position: relative;
display: block;
}
#home.full {
height: 100vh;
top: 0;
right: 0;
bottom: 0;
left: 0;
min-height: 32rem;
}
}
.services {
padding-bottom: 18em;
}
.scott .text,
.services .text {
margin: 0 auto;
padding-top: 5em;
}
@media screen and (max-width: 641px) {
.scott .text,
.services .text {
margin: 0 auto;
padding-top: 5%;
}
.black {
padding-bottom: 4rem;
}
.scott.black {
padding-bottom: 2rem;
}
}
.scott .text p {
font-size: 0.9em;
line-height: 1.5em;
}
.black h2 { color: #eee;
}
.black img {
width: 50%;
margin: 0 auto 0.75rem;
display: block;
}
.black .label {
max-width: 100%;
left: 0;
right: 0;
margin: 0 auto;
text-align: center;
color: white;
bottom: 2em;
position: absolute;
font-family: "CopperplateGothicStd-31BC";
text-transform: uppercase;
color: #eee;
}
.row {
position: relative;
}
.row.title-holder {
height: 5rem;
position: relative;
width: 100%;
top: 2rem;
margin-bottom: -5rem;
z-index: 9;
}
@media screen and (max-width: 641px) {
.row.title-holder {
padding: 0.5rem;
margin: 0;
top: 0;
height: auto;
}
}
.row strong {
font-family: "CopperplateGothicStd-31BC";
text-transform: uppercase;
font-size: 1rem;
display: block;
width: 100%;
text-align: center;
color: black;
z-index: 1000;
}
footer {
width: 100%;
max-width: 76em;
font-weight: 400;
display: flex;
justify-content: space-between;
margin: 1.2rem auto 1rem;
}
.footer-text {
display: block;
text-transform: uppercase;
letter-spacing: 1.3px;
text-align: center;
font-size: 0.65rem;
margin-bottom: 2rem;
}
footer ul {
list-style: none;
padding: 0;
margin: 0;
text-align: center;
}
footer ul:last-of-type li:first-child {
margin: 0.5rem auto 0.2rem;
}
footer .logo-holder {
position: relative;
padding-right: 0.2rem;
}
@media screen and (min-width: 756px) {
footer .logo-holder {
padding-right: 2.2rem;
}
}
footer .logo-holder a {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%;
width: 100%;
}
@media screen and (min-width: 500px) {
.footer-text {
display: inline-block;
letter-spacing: 1px;
font-size: 0.75rem;
}
.footer-text br {
display: none;
}
footer ul {
padding: 0 2rem;
}
footer ul:last-of-type li:first-child {
margin: 0;
}
}
footer ul:first-of-type li {
margin-top: 0.35rem;
line-height: 1.75;
}
footer ul:not(:first-of-type) li {
margin: 0;
text-align: center;
}
@media screen and (min-width: 756px) {
footer ul {
padding: 0.7rem 2rem 0;
}
.footer-text {
margin: 1rem 2rem;
}
footer ul:not(:first-of-type) li:first-child {
margin-right: 0;
margin-left: 1rem;
}
footer ul:not(:first-of-type) li {
margin-left: 1rem;
}
}
.page-template-page_contact footer {
display: none;
} @media print, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
} .mobile-only {
display: block;
visibility: visible;
}
.desktop-only {
display: none !important;
visibility: none;
}
@media screen and (min-width: 641px) {
.mobile-only {
display: none;
}
}
.row.intro .mobileThumb {
display: inline-block;
}
.show {
display: block;
}
.hide {
display: none;
}
.visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
clip: auto;
height: auto;
margin: 0;
overflow: visible;
position: static;
width: auto;
}
.invisible {
opacity: 0;
}
.clearfix:before,
.clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
.clearfix {
*zoom: 1;
} @media print {
*,
*:before,
*:after {
background: transparent !important;
color: #000 !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
text-shadow: none !important;
}
a,
a:visited {
text-decoration: underline;
}
a[href]:after {
content: " (" attr(href) ")";
}
abbr[title]:after {
content: " (" attr(title) ")";
}
a[href^="#"]:after,
a[href^="javascript:"]:after {
content: "";
}
pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid;
}
thead {
display: table-header-group;
}
tr,
img {
page-break-inside: avoid;
}
img {
max-width: 100% !important;
}
p,
h2,
h3 {
orphans: 3;
widows: 3;
}
h2,
h3 {
page-break-after: avoid;
}
}  .gallery-holder {
opacity: 1;
height: auto;
overflow: visible;
}
.page-template-page_project .site-main {
margin-top: 4rem;
}
@media screen and (min-width: 641px) {
.row.intro {
height: calc(100vh - 8.5rem);
min-height: 35vw;
max-height: 80vw;
}
.row.intro .img-holder {
height: 100%;
width: 100% !important;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.row.intro .img-holder:nth-child(2) {
opacity: 0;
}
.reveal-before .row.intro .img-holder:nth-child(2) {
opacity: 1;
}
.row.intro figure.img-holder[style*="padding-top:"] img {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
}
.row.intro .img-holder img {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100% !important;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
font-family: "object-fit: cover;";
}
} .project-nav {
margin: 4rem 2rem;
text-align: center;
text-transform: uppercase;
color: #868288;
font-size: 0.9em;
}
.project-nav span {
color: #868288;
padding: 0.5em;
}
.project-nav a {
color: #868288;
letter-spacing: 0.05em;
} .intro-home {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
background: transparent;
z-index: 10000000000;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-flex-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-transition: opacity 2.5s 3s ease-out, -webkit-transform 0.1s 6.7s;
transition: opacity 2.5s 3s ease-out, -webkit-transform 0.1s 6.7s;
transition: opacity 2.5s 3s ease-out, transform 0.1s 6.7s;
transition: opacity 2.5s 3s ease-out, transform 0.1s 6.7s, -webkit-transform 0.1s 6.7s;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.intro-home::before {
content: "";
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: #000;
-webkit-transition: opacity 3s 2.5s ease-out;
transition: opacity 3s 2.5s ease-out;
}
.full #logo {
display: none;
}
.intro-logo {
position: relative;
margin: auto;
height: 60vh;
width: 80%;
}
.intro-logo svg,
.logo-holder svg {
height: 100%;
width: 100%;
}
.logo-holder svg {
height: 3rem;
width: 3rem;
}
.monogram,
.logo-name {
margin: auto;
height: calc(3.5vmin + 1em);
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.monogram {
height: 33vmin;
}
.intro-logo svg {
display: block;
margin: auto;
}
.gradient .img-holder::before {
content: "";
position: absolute;
top: auto;
right: 0;
bottom: 0;
left: 0;
height: 12rem;
opacity: 0.3;
width: 100%;
background: linear-gradient(
to top,
hsl(0, 0%, 0%) 0%,
hsla(0, 0%, 0%, 0.987) 8.1%,
hsla(0, 0%, 0%, 0.951) 15.5%,
hsla(0, 0%, 0%, 0.896) 22.5%,
hsla(0, 0%, 0%, 0.825) 29%,
hsla(0, 0%, 0%, 0.741) 35.3%,
hsla(0, 0%, 0%, 0.648) 41.2%,
hsla(0, 0%, 0%, 0.55) 47.1%,
hsla(0, 0%, 0%, 0.45) 52.9%,
hsla(0, 0%, 0%, 0.352) 58.8%,
hsla(0, 0%, 0%, 0.259) 64.7%,
hsla(0, 0%, 0%, 0.175) 71%,
hsla(0, 0%, 0%, 0.104) 77.5%,
hsla(0, 0%, 0%, 0.049) 84.5%,
hsla(0, 0%, 0%, 0.013) 91.9%,
hsla(0, 0%, 0%, 0) 100%
);
}
nav ul li {
letter-spacing: 0.05em;
}
@media screen and (min-width: 800px) {
.menu-wrapper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-flex-align: center;
-ms-flex-align: center;
align-items: center;
}
} .page-template-page_recognition h2 {
text-align: center; }
.page-template-page_recognition .site-main {
padding-top: 4rem;
min-height: calc(100vh - 55px);
}
.page-template-page_recognition .grid__item {
margin-bottom: 2rem;
}
.page-template-page_recognition .img-holder {
position: relative;
}
@media screen and (min-width: 641px) {
.page-template-page_recognition .grid__item {
position: relative;
width: 48%;
}
.page-template-page_recognition .grid__item:hover .text-holder {
opacity: 1;
}
.page-template-page_recognition .img-holder {
position: relative;
overflow: hidden;
padding-top: 120%;
border: 1px solid rgba(000, 000, 000, 0.15);
}
.page-template-page_recognition img {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: top;
object-position: top;
font-family: "object-fit: cover;object-position: top;";
}
.page-template-page_recognition .text-holder {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-flex-align: center;
-ms-flex-align: center;
align-items: center;
background-color: #000;
color: #fff;
opacity: 0;
-webkit-transition: 0.35s ease-out;
transition: 0.35s ease-out;
padding: 0.5em;
}
.touch .page-template-page_recognition .text-holder {
position: relative;
display: block;
background-color: transparent;
color: #000;
opacity: 1;
}
.page-template-page_recognition .text-holder h2 {
color: #fff;
line-height: 1.2;
margin-bottom: 0.35em;
font-size: 0.98em;
}
.touch .page-template-page_recognition .text-holder h2 {
color: #676565;
}
}
@media screen and (min-width: 1024px) {
.page-template-page_recognition .grid__item {
width: 23.5%;
}
}
@media screen and (max-width: 641px) {
.page-template-page_recognition .text-holder h2 {
font-size: 1.15em;
margin: 0.75rem 0 0 0;
}
.page-template-page_recognition .grid__item img {
width: 100%;
}
}
.page-template-page_recognition p.press-info {
font-size: 1em;
margin: 0 0 4rem 0;
}
@media screen and (min-width: 641px) {
.page-template-page_recognition p.press-info {
font-size: 0.8em;
margin: 0;
}
}
p.press-info span {
text-transform: uppercase;
letter-spacing: 0.05em;
font-size: 0.9em;
} @media screen and (max-width: 799.99px) {
#site-navigation.toggled .menu-left-menu-container,
#site-navigation .menu-right-menu-container {
width: 100vw;
}
#site-navigation.toggled ul li {
width: auto;
}
.menu-wrapper {
padding-top: 7vh;
}
.toggled .menu-wrapper {
min-height: 200vh;
background-color: white;
}
}
.text {
max-width: 850px;
text-align: justify;
}
.black img {
width: 70%;
margin: 0 auto 2.75rem;
}
.scott .text {
padding-top: 6em;
}
.scott .text p {
line-height: inherit;
}
.page-template-page_about h2,
.feature-block-container h2 {
font-family: "CopperplateGothicStd-31BC";
text-transform: uppercase;
text-align: center;
font-size: 1rem;
font-weight: 300;
}
.services {
padding-bottom: 0;
margin-top: 5.75rem;
}
.services p {
font-size: 0.9em;
}
.testimonials {
padding: 5em 0;
background-color: #f2eee1;
margin-bottom: 5em;
}
h1 {
text-align: center;
width: 100%;
text-transform: uppercase;
font-weight: 300;
display: block;
font-size: 1.075rem;
} .full .img-holder {
height: 100%;
}
.page-template-page_contact .full .img-holder img {
height: 100%;
width: 100%;
object-fit: cover;
font-family: "object-fit: cover;";
}
.sans-serif {
font-weight: 100;
font-family: "Open Sans", sans-serif !important;
}
.page-template-page_about .full .img-holder {
opacity: 0.3;
background: none;
}
.page-template-page_about .full .img-holder img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
font-family: "object-fit: cover;";
}
.socials-container a {
width: 2rem;
height: 2rem;
}
.socials-container a svg {
width: 1.25rem;
margin: 0 0.2rem;
opacity: 0.75;
}
nav .socials-container a svg {
width: 1.45rem;
} .project-label {
position: relative;
}
.project-label button {
margin: 0 auto;
font-size: 0.9rem;
text-transform: uppercase;
outline: unset;
border: unset;
background: transparent;
}
.project-label .project-description-container {
font-family: "Open Sans", sans-serif;
margin: 0 auto;
font-size: 0.9rem;
}
p.before-button {
position: absolute;
top: 0;
right: 2rem;
bottom: auto;
left: auto;
font-size: 0.82rem;
margin: 0;
cursor: pointer;
}
p.before-button:after {
content: " BEFORE";
color: #888;
}
.reveal-before p.before-button:after {
content: " AFTER";
}
p.before-button:hover {
opacity: 0.6;
}
a.gallery-button:hover {
color: #b88c1d !important;
}
.black {
min-height: 100vh;
display: flex;
justify-content: center;
-webkit-flex-align: center;
align-items: center;
}
.press-info span.view-project { display: block;
margin: 0.85em auto 0;
text-transform: uppercase;
font-size: 0.85em;
letter-spacing: 0.1em;
color: rgba(219, 178, 88, 0.75);
} .featured-blocks-container {
max-width: 95%;
margin: 0.75rem auto;
}
.feature-block-container a {
position: relative;
}
@media screen and (min-width: 765px) {
.featured-blocks-container {
max-width: 98%;
margin: 1.2vw auto 0;
}
.feature-block-container a {
display: flex;
position: relative;
}
.feature-block-container:nth-child(odd) a {
flex-flow: row-reverse;
}
}
.feature-block-container .text-container {
width: 100%;
height: 38vw;
min-height: 16em;
height: auto;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
color: #000;
background-color: #ededed;
max-width: unset;
transition: color.35s ease-in;
}
.feature-block-container .text-container p:last-of-type {
color: #b79751;
transition: color.35s ease-in;
}
.feature-block-container:nth-child(2n) .image-holder {
right: 0;
left: auto;
}
.feature-block-container:nth-child(2n) .text-container {
background-color: #000;
color: #fff;
}
.feature-block-container:nth-child(3n) .text-container {
background-color: #b79751;
}
.feature-block-container a:hover .text-container p:last-of-type {
color: #000;
transition: color.35s ease-in;
}
.feature-block-container:nth-child(2n) a:hover .text-container p:last-of-type {
color: #fff;
transition: color.35s ease-in;
}
.feature-block-container .text-container h2 {
margin-bottom: 0;
}
.feature-block-container .text-container p {
max-width: 26em;
font-size: 0.9rem;
}
@media screen and (min-width: 756px) {
.feature-block-container .text-container p {
margin-top: 2em;
padding: 0.5rem;
}
.feature-block-container .text-container {
width: 100%;
height: 38vw;
min-height: 25em;
}
}
@media screen and (min-width: 1010px) {
.feature-block-container .text-container p {
font-size: 1rem;
}
}
.feature-block-container .text-container p:not(:first-of-type) {
margin-top: 0; }
.feature-block-container:nth-child(2n) .text-container p:not(:first-of-type),
.feature-block-container .text-container p:not(:first-of-type) {
color: #b79751;
}
.feature-block-container:last-of-type .text-container p:not(:first-of-type) {
color: #fff;
}
@media screen and (min-width: 756px) {
.feature-block-container .text-container {
width: 40%;
}
}
.feature-block-container .image-holder img {
vertical-align: bottom;
}
@media screen and (min-width: 756px) {
.feature-block-container .image-holder {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%;
width: 60%;
overflow: hidden;
}
.feature-block-container .image-holder img {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%;
width: 100%;
object-fit: cover;
vertical-align: bottom;
}
} .blog h2,
.single h1 {
text-transform: capitalize;
position: relative;
color: #b88c1d;
margin: 1.5em 0 0;
}
.blog p {
max-width: 45em;
font-size: 0.9rem;
margin: 0 auto 2.5em;
padding: 0 2%;
}
.blog .grid__item h4 {
margin-bottom: 0.5rem;
font-family: "Open Sans", sans-serif;
font-weight: 400;
opacity: 1;
}
.blog .grid__item p {
font-size: 0.85rem;
font-style: italic;
opacity: 0.85;
width: 80%;
margin: 0 auto;
} .single p,
.single .wp-block-image .size-large {
max-width: 45em;
margin: 2em auto;
padding: 0 5%;
}
.single .wp-block-image .size-large {
padding: 0;
}
@media screen and (min-width: 756px) {
.single p {
padding: 0;
}
}
.single .wp-block-image.size-full img {
width: 100%;
max-height: 85vh;
object-fit: cover;
}
.single .wp-block-image figcaption {
text-align: center;
font-size: 0.8rem;
}
.single h1 {
margin: 2.5em auto 0;
}
.single p {
margin: 0em auto 4em;
}
.single p:first-of-type {
margin: 0em auto 4em;
}
.single p + p {
margin-top: -2em;
}
@media screen and (min-width: 756px) {
.single h1 {
margin: 1.5em auto 0;
}
.single .wp-block-image.size-full img {
min-height: 40em;
}
}