.no-touch #services-list ul li.service-box:hover{
background-color:#ca4623;
}
/* award page extra css */
.twoColBlock-col_text .award-video.margin-left h5 {
font-size: 18px;
font-style: italic;
text-align: left;
color: #b6b6b6;
bottom: 0;
position: absolute;
font-weight: 100;
margin-bottom: 14px;
left: 35%;
}
@media screen and (min-width: 1369px){
/* .service-desc{
}
.service-desc .service-slide-block{
width:100%;
padding-left: 10%;
padding-right: 10%;
}
.service-desc .service-text{
max-width: 44.48%;
}
.service-desc .service-image {
max-width: 46.65%;
}*/
}
@media screen and (max-width: 480px){
#featured-projects .featured-project{
width:49.4%;
}
.page-template-template-employee-login .siteBody {
transform: none;
top: 68px;
}
.login-form .login-btn {
padding: 7px 0;
height: 30px;
}
.login-form h1 {
margin-top: 41px;
margin-bottom: 36px;
}
.login-form .password {
margin-bottom: 37px;
}
/*.flickity-slider .project-slide {
height: auto !important;
}*/
.single-project .project-slider-container, .project-slider-container .project-slider, .flickity-slider .project-slide {
height: auto !important;
}
.project-slider-container .flickity-viewport {
height: 350px !important;
}
}
@media screen and (max-width: 1024px){
#featured-projects .featured-project span{
opacity: 1;
}
}
@media screen and (min-width: 1024px){
#services-list ul li.service-box:hover {
background-color:#ca4623;
}
#services-list ul li.service-box.odd:hover,
#services-list ul li.service-box.odd.active{
background-color:#c63813 !important;
border-bottom-color:#c63813;
}
}
@media screen and (max-width: 768px){
.single-project .project-slider-container, .project-slider-container .project-slider {
height: auto !important;
}
.project-slider-container .flickity-viewport {
height: 523px !important;
}
}
@media screen and (min-width: 768px){
body.single-projects{
overflow:hidden;
}
}
.top-banner .banner-menu-container ul.banner-menu li a label.mobile{
display: inline;
cursor: pointer;
}
.top-banner .banner-menu-container ul.banner-menu li a label.desktop{
display: none;
cursor: pointer;
}
@media screen and (min-width:480px){
.top-banner .banner-menu-container ul.banner-menu li a label.desktop{
display: inline;
}
.top-banner .banner-menu-container ul.banner-menu li a label.mobile{
display: none;
}
}
ul.client-list li:first-child {
margin-bottom:20px;
}
ul.client-list li:first-child i{
font-size:20px;
font-weight: 600;
}
.screen-reader-response{
display:none;
}
.wpcf7-not-valid-tip, .wpcf7-validation-errors{
color: #fd0000;
font-size: 14px;
}
.portal-content .portal-col-2 .fill-form-text a{
color: #ff6f49;
}
.portal-content .portal-col-2 .fill-form-text a:hover{
color: #ff5b30;
}
ul.core-values li:first-child {
margin-bottom: 0;
}
ul.client-list {
/* height: 270px;
overflow-y: auto;*/
}
ul.client-list.core-values li:first-child i{
font-weight: 400;
}
ul.client-list::-webkit-scrollbar {
display: none;
}
.page-template-template-join-seadar .siteBody {
margin-top: 65px;
}
@media screen and (min-width: 35.5em){
.page-template-template-join-seadar .siteBody {
margin-top: 88px;
}
}
.join-sea-dar p.content-body {
margin: 0 0 48px !important;
}
.join-sea-dar strong {
margin-bottom: 30px;
}
.page-id-6 ul.client-list li:first-child, .page-id-744 ul.client-list li:first-child, .page-id-23 ul.client-list li:first-child{
margin-bottom:0;
}
@media screen and (min-width: 48em){
.core-values-container.twoColBlock-col {
padding: 63px 105px 100px;
}
.page-template-template-client-list .twoColBlock-col, .page-template-template-in-progress .twoColBlock-col {
width: calc(100% - 280px);
max-width: 100%;
float: left;
}
.page-template-template-client-list .twoColBlock-col--orange, .page-template-template-in-progress .twoColBlock-col--orange {
max-width:280px;
float: left;
}
.page-template-template-client-list .twoColBlock-col, .page-template-template-in-progress .twoColBlock-col {
height: 100vh !important;
}
}
@media screen and (min-width: 64em){
.page-template-template-client-list .twoColBlock-col--orange, .page-template-template-in-progress .twoColBlock-col--orange {
max-width:520px;
}
.page-template-template-client-list .twoColBlock-col, .page-template-template-in-progress .twoColBlock-col {
width: calc(100% - 520px);
}
.core-values-container.twoColBlock-col {
padding: 63px 30px 83px;
}
}
.join-sea-dar ul.client-list li {
margin-bottom: 12px !important;
font-size: 1rem;
line-height: 21px;
}
.join-sea-dar ul.client-list {
margin: 0 0 1em 1.4em;
padding: 0;
list-style-type: none;
}
.join-sea-dar {
font-size: 18px;
line-height: 22px;
color: #d0d0d0;
}
.join-sea-dar strong i {
font-size: 17px;
line-height: 22px;
}
.join-sea-dar-left .portal-col-1 .left-content {
font-size: 15px;
line-height: 21px;
}
.join-sea-dar-left .portal-col-1 a {
font-size: 1rem;
line-height: 20px;
}
.join-sea-dar-left .portal-col-1 span {
display: block;
padding-bottom: 25px;
}
.join-sea-dar ul.client-list{
height: 100%;
}
#featured-projects .featured-project img{
height:50vh;
}
.page-template-template-in-progress .client-list-container .twoColBlock-contentBox{
margin-bottom: 100px;
}
.page-template-template-core-values .client-list-container .client-list{
font-size: 19px;
line-height: 33px;
}
.client-list-container {
/*min-height: 100vh;*/
}
.page-template-template-employee-login{
overflow: hidden;
}
.page-template-template-in-progress .client-list-container .innerNav, .twoColBlock-col .innerNav{
position: absolute;
bottom: 35px;
}
/*.page-template-template-in-progress .client-list-container .top75{
bottom: 75px;
}*/
.error404 .background-img
{
background-image: url('http://designcostaging.com/clients/Sea-Dar/wp-content/uploads/2016/12/02-Sea-Dar-SeaportPH.jpg');
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
.error404 .background-img::before {
content: "";
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
position: absolute;
left: 0;
right: 0;
}
.error404 .banner-menu-container {
z-index: 999;
position: absolute;
width: 100%;
height: auto;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
top: 50%;
left: 0;
right: 0;
}
.error404 h2 {
margin: 0 0 35px 0;
font-size: 35px;
font-weight: normal;
line-height: 25px;
text-transform: uppercase;
color: #dedddd;
}
.error404 p {
font-size: 26px;
color: #dedddd;
line-height: 17px;
}
@media only screen and (max-width: 480px)
{
.error404 .background-img
{
background-image: url('http://designcostaging.com/clients/Sea-Dar/wp-content/uploads/2016/12/02-Sea-Dar-SeaportPH_Mobile.jpg');
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
.error404 h2 {
margin: 0 0 25px 0;
font-size: 23px;
line-height: 0;
}
.error404 p {
font-size: 17px;
line-height: 24px;
padding: 0px 12%;
}
.hamburger {
width: 22px;
padding: initial;
backface-visibility: hidden;
transition: all .3s ease-in-out;
}
.hamburger span, .hamburger:before, .hamburger:after {
content: "";
display: block;
height: 3px;
margin-bottom: 4px;
background: #fff;
transition: all .3s;
backface-visibility: hidden;
width: 22px;
}
.siteHeader-navIcon {
margin: 24px 15px 0 0;
}
.is-open .hamburger:before {
margin-top: 10px;
transform: rotate(-45deg);
position: relative;
right: 2px;
}
.is-open .hamburger:after {
margin-top: -14px;
transform: rotate(45deg);
position: relative;
right: 2px;
}
}
.error404 .siteFooter
{
display:none;
}
.wpcf7-response-output {
margin-top: -15px;
}
@media only screen and (max-width:740px){
.single-project .project-slider-container .project-slider .project-slide img {
height: auto;
width: 100%;
}
.single-project .project-slider-container .project-slider .project-slide.horizontal-slide {
height: auto;
background-size: cover;
top: 0;
bottom: 0;
background-position: center;
/*top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);*/
}
.single-project .project-detail .project-detail-inner {
}
}
#warning-message { display: none;
position: fixed;
top: 50%;
left: 50%;
text-align: center;
transform: translate(-50%, -50%);
}
@media only screen and (max-width: 767px) and (orientation:portrait){
#warning-message { display:none; }
}
@media only screen and (max-width: 767px) and (orientation:landscape){
#warning-message { display:block; }
.single-project { display:none; }
}
@media only screen and (max-width: 479px){
#warning-message { display:none; }
.single-project { display:block; }
}
@media only screen
and (min-device-width: 375px)
and (max-device-width: 667px)
and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 2)
{
.login-logo-mobile {
display: block;
width: 60%;
height: auto;
margin: 10% auto 0;
}
.login-form h1 {
text-transform: uppercase;
font-size: 6vw;
}
.login-form .login-btn {
padding: 9px 0;
height: 35px;
}
.single-project .project-slider-container {
top: 45%;}
.twoColBlock-col--orange .twoColBlock-contentBox {
padding: 0 25px;
}
}
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (-webkit-min-device-pixel-ratio: 2) {
.siteHeader-nav-inner {
position: relative;
top:60px;
transform: none !important;
}
}
@media only screen and (min-device-width: 768px)
and (max-device-width: 1024px) and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 2) {
.page-template-template-client-list .twoColBlock-col, .page-template-template-in-progress .twoColBlock-col {
width: 50%;
}
.filter-type-container .filter-types ul li ul {
margin-top: 35px;
}
}
/*Style Updates*/
.banner--img .background-img{
margin-top: 88px;
background-position: center 69%;
}
.news_container{
margin: 0 10.6% 328px 10.6%;
}
@media screen and (max-width: 1023px){
.news_container{
margin: 0px 30px 328px 30px;
}
}
@media screen and (max-width: 767px){
.news_container{
margin: 0px;
}
}
.news_container a{
color:#b6b6b6;
}
.twoColBlock-text{
width: 44.6%;
text-align: right;
font-size: 42px;
height: 379px;
}
@media screen and (max-width: 767px){
.twoColBlock-text{
height: 350px;
}
}
.twoColBlock-img{
width: 55.4%;
min-height: 0;
float: left;
height: 379px;
}
@media screen and (max-width: 410px){
.twoColBlock-img{
height: 300px;
}
}
@media screen and (max-width: 767px){
.twoColBlock_border .twoColBlock-text{
width: 100%;
}
.twoColBlock_border .twoColBlock-img{
width: 100%;
}
}
.news_container .twoColBlock-col_text{
background: #1a1a1a;
}
.twoColBlock-col_text{
padding: 89px 32px 24px 32px;
min-height: 350px;
font-size: 42px;
font-weight: 600;
line-height: 1.3;
text-align: center;
background: #232323;
color: #d0d0d0;
display: inline-block;
position: relative;
text-align: left;
}
@media screen and (max-width: 1023px){
.twoColBlock-col_text{
padding: 60px 32px 24px 32px;
}
.single-project .project-slider-container .project-slider .project-slide.vertical-slide{
width: 100%!important;
margin-left: 43px!important;
background-position: left 0 center!important;
background-size: cover!important;
}
}
@media screen and (max-width: 767px){
.twoColBlock-col_text{
padding: 40px 18px 24px 18px;
}
}
.twoColBlock-col_text h2{
margin: 0 0 26px;
font-size: 35px !important;
text-transform: uppercase;
color: #b6b6b6;
}
.twoColBlock-col_text p{
margin: 0 0 14px;
font-size: 20px;
line-height: 28px;
color: #b6b6b6;
margin-bottom: 0px !important;
font-weight: 600;
}
@media screen and (max-width: 1023px){
.twoColBlock-col_text p{
font-size: 18px;
}
}
.twoColBlock-col_text p:nth-child(3) {
font-weight: 500;
}
.twoColBlock-col_text h5{
font-size: 18px;
font-style: italic;
text-align: left;
color: #b6b6b6;
bottom: 0;
position: absolute;
font-weight: 100;
margin-bottom: 14px;
}
.twoColBlock-col_text h4{
font-size: 14px;
color: #b6b6b6;
bottom: 0;
position: absolute;
right: 32px;
font-weight: 100;
margin-bottom: 14px;
}
.twoColBlock-bg{
height: 379px;
background-size: cover !important;
background-position: bottom !important;
}
@media screen and (max-width: 767px){
.twoColBlock-bg{
height: 379px;
background-size: cover !important;
}
}
@media screen and (max-width: 410px){
.twoColBlock-bg{
height: 300px;
background-size: 120% 100% !important;
}
}
.awards_heading h2{
margin-top: 63px;
margin-bottom: 0px;
text-align: center;
font-size: 33px;
text-transform: uppercase;
color: #b6b6b6;
}
@media screen and (max-width: 1023px){
.awards_heading h2{
text-align: left;
margin-left: 95px;
}
}
@media screen and (max-width: 767px){
.awards_heading h2{
text-align: left;
margin-left: 6.8%;
margin-top: 63px;
margin-bottom: -8px;
}
}
.twoColBlock_border {
padding-top: 114px;
}
@media screen and (max-width: 767px){
.twoColBlock_border {
padding-top: 90px;
}
}
.twoColBlock_border:last-child {
margin-bottom: 0px;
}
.twoColBlock_border1, .twoColBlock_border2, .twoColBlock_border1, .twoColBlock_border2{
border-bottom: 5px solid #ca4623;
}
.twoColBlock_border2 .twoColBlock-img, .twoColBlock_border2 .twoColBlock-img{
float: right;
}
.twoColBlock_border2 .twoColBlock-bg {
background-position: center !important;
}
.twoColBlock_orange{
width: 33%;
background:#ca4623;
}
@media screen and (max-width: 1023px){
.twoColBlock_orange{
display: none;
}
}
.twoColBlock_img_text{
width: 67%;
}
@media screen and (max-width: 1023px){
.twoColBlock_img_text{
width: 100%;
}
}
.twoColBlock_press{
display: flex;
}
@media screen and (max-width: 767px){
.twoColBlock_press{
display: block;
}
}
.two_col_img{
float: left;
margin-left: 110px;
}
@media screen and (max-width: 767px){
.two_col_img{
float: none;
margin-left: 0px;
}
}
.twoColBlock_img_text .two_col_text{
position: absolute;
left: 422px;
top: 50%;
transform: translateY(12%);
}
@media screen and (max-width: 767px){
.twoColBlock_img_text .two_col_text{
position: relative;
margin-left: 0px;
bottom: 0;
left: 0;
right: 0;
top: 0;
margin-top: 15px;
}
}
.twoColBlock_img_text .two_col_text h5{
position: relative;
font-size: 18px;
margin-top: 20px;
top: 0;
}
@media screen and (max-width: 767px){
.twoColBlock_img_text .two_col_text h5{
font-size: 16px;
margin-top:28px;
margin-bottom: 0;
}
}
.twoColBlock_img_text .two_col_text p{
font-size: 22px;
transition: all .3s ease-in-out;
}
@media screen and (max-width: 767px){
.twoColBlock_img_text .two_col_text p{
font-size: 17px;
line-height: 26px;
}
}
.twoColBlock_img_text .two_col_text p:hover{
color:#ff6f49;
}
.press_container .twoColBlock-col_text{
padding: 70px 32px 65px 32px;
}
@media screen and (max-width: 767px){
.press_container .twoColBlock-col_text{
padding: 73px 32px 69px 32px;
border-bottom: 1px solid gray;
width: 95%;
margin-left: 9px;
}
.divider {
display: none;
}
}
@media screen and (max-width: 500px){
.press_container .twoColBlock-col_text{
padding: 73px 32px 69px 32px;
border-bottom: 1px solid gray;
width: 94%;
margin-left: 9px;
}
}
@media screen and (max-width: 410px){
.press_container .twoColBlock-col_text{
padding: 73px 32px 69px 32px;
border-bottom: 1px solid gray;
width: 94%;
margin-left: 9px;
}
}
.twoColBlock_img_text .awards_heading h2{
text-align: left;
margin-left: 108px;
margin-bottom: 158px;
text-transform: uppercase;
font-size: 33px !important;
margin-top: -5px;
}
@media screen and (max-width: 767px){
.twoColBlock_img_text .awards_heading h2{
margin-left: -10px;
margin-bottom: 80px;
}
}
.press_container .twoColBlock_press{
padding: 0px;
}
.twoBlock_padding .two_col_text{
position: absolute;
left: 422px;
top: 30%;
transform: translateY(21%);
}
@media screen and (max-width: 767px){
.twoBlock_padding .two_col_text{
position: relative;
margin-left: 0px;
bottom: 0;
left: 0;
right: 0;
top: 0;
margin-top: -8px;
}
.twoColBlock_img_text .two_col_text{
margin-top: 0px;
}
}
.divider{
width: 100%;
text-align: center;
position: relative;
height: 0px;
background: #1a1a1a;
top: 60px;
}
.divider .line{
background: #434343;
height: 1px;
width: 428px;
}
@media screen and (max-width: 767px){
.divider .line{
position: absolute;
background: #434343;
height: 1px;
width: 80%;
top: 225px;
left: 0;
right: 0;
}
.twoBlock_padding .divider .line{
top: 182px;
}
}
.img_bg_up{
position: relative;
}
.img_bg_up img{
position: absolute;
left: 8px;
bottom: 13px;
}
@media screen and (max-width:767px){
.img_bg_up img{
max-height: 78px;
left: auto;
right: 10px;
}
}
.img_bg_up:hover {
opacity: 0.8;
}
.press_container a{
color:#d0d0d0;
transition: all .3s ease-in-out;
}
.banner--img .background-img.press-background-img {
margin-top: 88px;
background-position: center left;
}
@media screen and (max-width:767px){
.banner--img .background-img{
margin-top:70px;
}
}
.twoColBlock h2 {
margin: 0px;
font-size: 30px;
text-transform: none;
color: #b6b6b6;
font-weight: 600;
margin-bottom: 17px;
}
a:hover {
color: #ff6f49;
}
.twoColBlock-img{
position: relative;
}
.news_container a, .img_bg_up{
transition: all .3s ease-in-out;
}
@media screen and (min-width: 1200px){
.news_container {
text-align: center;
}
.news_container .twoColBlock_border {
display: inline-block;
}
.twoColBlock-img {
width: 548px;
}
.twoColBlock-text {
width: 480px;
}
}
@media screen and (min-width: 1200px) and (max-width: 1320px){
.news_container {
margin: 0px 6.6% 328px 6.6%;
}
}
@media screen and (max-width: 991px) {
.twoColBlock-col_text h2{
font-size: 23px !important;
}
}
@media screen and (max-width: 410px){
.twoColBlock-img a img{
max-width: 96%;
}
}
.top-banner .press-background-img:before {
content: "";
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
position: absolute;
left: 0;
right: 0;
}
.two_col_text p:nth-child(2) {
font-weight: 700;
}
.two_col_text p{
font-weight: 500;
}
.twoColBlock_img_text .two_col_text p.without--link:hover {
color: #d0d0d0;
}
@media screen and (min-width: 768px) and (max-width: 1199px){
.twoColBlock-col_text h2 {
font-size: 30px !important;
}
.twoColBlock-col_text {
padding: 89px 32px 24px 32px;
}
.twoColBlock-col_text h5 {
font-size: 16px;
}
.twoColBlock-col_text .award-video.margin-left h5 {
font-size: 16px;
left: 40%;
}
.twoColBlock-col_text h4 {
font-size: 16px;
}
.divider .line {
width: 342px;
}
.twoColBlock_img_text .awards_heading h2{
margin-bottom: 115px;
}
.twoColBlock_img_text .two_col_text p a {
font-size: 20px;
}
.twoColBlock_img_text.twoColBlock-col_text.js-mh .two_col_img a img {
max-width: 195px;
}
.twoColBlock_img_text.twoColBlock-col_text.js-mh.twoBlock_padding .two_col_img img {
max-width: 195px;
}
.twoBlock_padding .two_col_text {
left: 370px;
}
.twoColBlock_img_text .two_col_text {
left: 370px;
}
.twoColBlock-img.js-mh {
max-width: 380px;
}
.twoColBlock-text.twoColBlock-col_text.js-mh {
max-width: 328px;
width: 328px;
}
section.contentRow.twoColBlock.u-clearfix.twoColBlock_border.twoColBlock_border1 {
width: 708px;
margin: 0 auto;
}
section.contentRow.twoColBlock.u-clearfix.twoColBlock_border.twoColBlock_border2 {
width: 708px;
margin: 0 auto;
}
.twoColBlock-col_text p {
font-weight: 700;
line-height: 24px;
font-size: 16px;
}
.twoColBlock-col_text p:nth-child(3) {
line-height: 24px;
font-size: 16px;
}
.twoColBlock-col_text{
padding-top: 80px
}
}
@media screen and (max-width: 767px){
.twoColBlock-col_text h2 {
font-size: 24px !important;
}
.twoColBlock_img_text.twoColBlock-col_text.js-mh div#press h2 {
margin-top: -10px;
}
.twoColBlock_img_text.twoColBlock-col_text.js-mh .two_col_img a img {
max-width: 206px;
}
.twoColBlock_img_text.twoColBlock-col_text.js-mh.twoBlock_padding .two_col_img img {
max-width: 206px;
}
.divider .line {
width: 232px;
}
.press_container .twoColBlock-col_text{
border:none;
}
.twoColBlock_img_text.twoColBlock-col_text.js-mh.twoBlock_padding:after {
content: '';
width: 232px;
height: 1px;
position: absolute;
top: 0;
display: block;
background: gray;
}
.press_container .section.contentRow.twoColBlock.u-clearfix.twoColBlock_border.twoColBlock_press:last-child {
margin-bottom: 60px;
}
}
section.contentRow.twoColBlock.u-clearfix.twoColBlock_border.twoColBlock_press:last-child {
margin-bottom: 100px;
}
@media screen and (max-width: 767px){
/*.twoColBlock-col_text h5{
top: 185px;
}
.twoColBlock-col_text h4{
top:192px;
}
.twoColBlock-text {
max-height: 255px;
min-height: 255px;
}*/
.twoColBlock-text.twoColBlock-col_text.js-mh {
height: auto;
min-height: auto;
padding-bottom: 84px;
}
.twoColBlock_img_text.twoColBlock-col_text.js-mh.twoBlock_padding .two_col_text {
margin-top: 17px;
transform: translateY(0%);
}
.twoColBlock_img_text.twoColBlock-col_text.js-mh .two_col_text {
margin-top: 17px;
transform: translateY(0%);
}
.twoColBlock_img_text.twoColBlock-col_text.js-mh .two_col_text {
margin-top: 17px;
}
span.award_project_year {
position: absolute;
width: 94%;
margin-top: 85px;
}
.twoColBlock_img_text.twoColBlock-col_text.js-mh div#press h2 {
word-spacing: 10em;
}
}
@media screen and (max-width: 410px){
.twoColBlock_img_text .awards_heading h2 {
font-size: 26px !important;
}
}
@media screen and (min-width: 1200px){
.twoColBlock h2 {
font-size: 39px !important;
width: 344px;
}
.twoColBlock-col_text p {
font-weight: 500;
line-height: 26px;
font-size: 18px;
width: 368px;
}
.twoColBlock-col_text p:nth-child(3) {
line-height: 26px;
font-size: 18px;
width: 368px;
}
.twoColBlock-col_text{
padding-top: 80px
}
}
@media screen and (min-width: 1024px){
.twoColBlock_orange.js-mh:after {
content: '';
width: 33%;
height: 200px;
background: #ca4623;
display: block;
position: absolute;
bottom: -100px;
}
}
@media screen and (min-width: 768px){
.twoColBlock_img_text .awards_heading h2 {
word-spacing: -8px;
}
}
.press_container .two_col_text p {
font-weight: 500;
}
.press_container .two_col_text p:nth-child(2) {
font-weight: 700;
}
@media screen and (max-width: 767px){
.twoColBlock_border:last-child {
margin-bottom: 100px;
}
}
@media screen and (min-width: 570px) and (max-width: 767px){
.twoColBlock-bg {
height: 379px;
background-size: 100% 113% !important;
background-position: center !important;
}
}
.new_city {
font-size: 22px;
font-weight: 500;
margin-bottom: 11px;
margin-top: -7px;
}
.new_city span {
font-size: 20px;
}
.new__city {
font-size: 15px;
font-style: italic;
}
@media screen and (max-width: 767px){
.new_city {
font-size: 17px;
line-height: 26px;
}
.new_city span {
font-size: 17px;
}
}
@media screen and (max-width: 350px){
.new__city {
font-size: 14.5px;
}
.twoColBlock-col_text h5 {
font-size: 16px;
}
.twoColBlock-col_text .award-video.margin-left h5 {
font-size: 16px;
}
}
/* 08 Aug 2018*/
.twoColBlock-col .innerNav {
background: #1e1e1e;
position: relative !important;
bottom: 70px !important;
}
.client-list-container .client-list {
height: 45vh;
}
.page-template-template-client-list .client-list-container .client-list {
height: 45vh;
}
.page-template-template-client-list .client-list-container .twoColBlock-contentBox {
margin-bottom: 100px;
}
@media (min-width:1024px){
.page-template-template-client-list-php footer.siteFooter,
.page-template-template-in-progress-php footer.siteFooter{
position: fixed;
width: 100%;
left: 0;
right: 0;
bottom: 0;
height: 45px;
}
.page-template-template-client-list-php .siteFooter-inner,
.page-template-template-in-progress-php .siteFooter-inner{
padding: 0 30px;
}
.page-template-template-client-list-php .twoColBlock-col,
.page-template-template-in-progress-php .twoColBlock-col {
min-height: 500px;
}
}
@media screen and (max-width: 1199px) and (min-width: 768px){
.twoColBlock_img_text.twoColBlock-col_text.js-mh .two_col_img img {
max-width: 195px;
}
}
/* Login Page */
.login-frm-main {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #0d0d0d;
}
.login-frm-main::before {
position: absolute;
content: "";
left: 0;
right: 0;
top: 0;
bottom: 0;
background-image: url("bg-image.png");
background-size: cover;
background-position: center center;
}
.login-frm-sub {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
box-sizing: border-box;
}
.login-frm-content-main {
height: 100%;
position: relative;
padding: 40px 60px 60px 60px;
box-sizing: border-box;
}
.login-frm-content-sub {
width: 100%;
max-width: 505px;
position: absolute;
box-sizing: border-box;
top: 50%;
left: 0;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
text-align: left;
z-index: 1;
right: 0;
margin: 0 auto;
padding: 0 15px;
}
.login-frm-content-sub h2,
.login-frm-content-sub h1 {
font-weight: 600;
font-style: normal;
font-size: 20px;
/*text-transform: uppercase;*/
/* letter-spacing: .2em; */
/*color: #888686;*/
color: #dedddd;
line-height: 1em;
margin-top: 0;
margin-bottom: 15px;
}
/* .login-frm-content-sub h2 {
font-weight: 400;
font-style: normal;
font-size: 14px;
text-transform: uppercase;
letter-spacing: .2em;
/*color: #888686;
color: #dedddd;
line-height: 1em;
margin-top: 0;
margin-bottom: 35px;
} */
.login-frm-content-sub h2{
margin-bottom: 25px;
}
.login-frm-content-sub p {
font-weight: 300;
font-style: normal;
font-size: 14px;
line-height: 22px;
color: #dedddd;
margin: 0 auto;
}
.login-frm-content-sub input[type="password"] {
background-color: transparent;
/*color: #888686;*/
color: #dedddd;
font-weight: 300;
border-bottom: 1px solid #616060;
padding: 0;
height: 28px;
border-top: none;
border-right: none;
border-left: none;
/*max-width: 300px;*/
width: 163px;
/*margin-top: 20px;*/
margin-top: 30px;
font-size: 11px;
}
#submit {
background: transparent;
border: none;
padding: 0px;
margin: 0px 0px 0px -25px;
color: #fff!important;
}
.login-frm-content-sub .fa {
top: -5px;
right: -15px;
fill: #888686;
font-size: 18px;
opacity: .5;
/*position: absolute;
width: 50px;
height: 45px;*/
transition: all .2s ease;
}
.login-frm-content-sub .fa:hover {
opacity: 1;
cursor: pointer;
}
.loginerrmsg {
color: red;
font-size: 12px;
margin-top: 10px;
}
.mb-15 {
margin-bottom: 15px;
}
/* Login Page */
@media screen and (max-width: 768px) {
#portfolio-container {
max-width: 100%;
padding: 0 15px;
box-sizing: border-box;
}
#portfolio-images {
margin: 0 !important;
display: flex;
flex-direction: column;
align-items: center;
}
#portfolio-images a {
display: block;
width: 100% !important;
margin-bottom: 10px;
}
#portfolio-images .portfolio-item {
width: 100% !important;
max-width: 100% !important;
height: 250px !important;
float: none !important;
position: relative !important;
left: auto !important;
top: auto !important;
}
}
.press_container .twoColBlock_press .two_col_img img{max-width:245px;}
/* ============================================================
Nav label line-height — structural fix (2026-08-14)
------------------------------------------------------------
PROBLEM: application.css gave .siteNavigation no line-height, so nav
links inherited 1.4 from body. That single value was doing two jobs at
once — leading INSIDE a label, and (via its half-leading) most of the
rhythm BETWEEN items, since `.siteNavigation li` only adds 6px. The two
needs conflict as soon as a label wraps: 1.4 that reads correctly
between items is far too loose within one. The previous workaround was
a per-item `.two-line` class (application.css:3366) applied by hand in
WP Admin alongside a manual
in the label. Miss either half and
the spacing is silently wrong — which is exactly what happened when
the Project Space item was added.
FIX: separate the concerns. Pin internal leading for every nav link,
and let margin own the inter-item rhythm.
The calc() is not arbitrary. At line-height 1.4 each single-line item
carries 0.2em of half-leading above and below, so the visible gap
between two items is 6px + 0.4em. Dropping to line-height 1 removes
that, and adding it back as margin preserves the previous spacing
exactly. It must stay in `em`, not px: .siteNavigation font-size is
viewport-based (7.2vw / 4vw / 2.4vw across breakpoints), so an em
compensation scales with it automatically.
RESULT: a manual
now works on its own. `.two-line` is left in
application.css as harmless and redundant — do not add it to new items.
SCOPE: deliberately `.siteHeader-nav-main > ul > li`, NOT
`.siteNavigation li`. The `.siteNavigation` class is ALSO on the sub
nav (`siteNavigation siteNavigation--sub`, the Join Sea-Dar /
Subcontractors / Real Estate list), and a `.siteNavigation li` rule
here would load after application.css at equal specificity — silently
overriding that list's `margin-bottom: 3px` and the dropdowns'
spacing. The child combinators also keep `.sub-menu li` untouched.
Dropdown links still inherit line-height 1.4; if one of those ever
wraps it will look loose, and the same treatment can be extended to
`.siteNavigation .sub-menu > li > a` at that point.
`text-wrap: balance` only affects UNPLANNED wraps — it breaks a too-long
label evenly instead of orphaning one word. Deliberate breaks are still
authored with
, because a vw-based font-size makes a natural wrap
point drift unpredictably across viewports.
============================================================ */
.siteHeader-nav-main > ul > li > a {
display: block;
line-height: 1;
text-wrap: balance;
}
.siteHeader-nav-main > ul > li {
/* Restores the theme's ORIGINAL visual gap, unchanged. Only the
mechanism differs, so that multi-line labels get correct internal
leading (see above).
The original gap came from two sources added together: the li's own
margin, plus 0.4em of half-leading from the inherited line-height
1.4. With line-height pinned to 1 that leading is gone, so it is
added back as margin — `calc( + 0.4em)` reproduces
the previous spacing to the pixel.
The original margin was NOT one value; it differed by breakpoint:
< 48em 6px (.siteNavigation li, application.css)
>= 48em 10px (.siteHeader-nav-main li, application.css:3287)
Both are mirrored below. TUNE HERE if the gap should change — raise
the em term for a proportional change, the px term for a specific
pixel amount, and remember to do it in BOTH rules.
!important is required, not lazy. The >= 48em rule in application.css
carries !important, so it outranks any non-important rule at every
width above 768px. Without !important here, spacing changes land on
phones only and silently do nothing on tablet or desktop — which is
exactly how an earlier attempt was missed.
That application.css rule is deliberately left in place rather than
deleted: its selector is `.siteHeader-nav-main li` (descendant, not
child), so it also governs the DROPDOWN items (Overview / Core Values
/ People, Awards / Press). Removing it would quietly drop those from
10px to the 6px base. This rule uses `> ul > li`, so it claims the
top-level items only and leaves the dropdowns as they were. */
margin-bottom: calc(6px + 0.4em) !important;
max-width: 100%;
}
@media screen and (min-width: 48em) {
.siteHeader-nav-main > ul > li {
margin-bottom: calc(10px + 0.4em) !important;
}
}
/* ============================================================
HOME GRID — "THE PROJECT SPACE" TILE: LOCK THE ASPECT RATIO
------------------------------------------------------------
The home grid tiles have no height of their own. On desktop
(>= 48em) `.homeGrid-column` is `height: auto` and the only thing
in the flow is the `![]()
` inside `.homeGrid-box`, sized
`width: 100%; height: auto` in application.css. So the tile's
height is whatever the swapped-in image's intrinsic aspect ratio
happens to be — replace a 685x186 image with a 2048x1366 one and
the row grows from 172px to 423px (measured at a 1265px grid
width), which is what broke this tile.
The visible pixels come from that same `![]()
`, not from the
inline `background-image` on the — the img paints over the
background, and only the `:before` scrim sits above it. So the
img cannot simply be hidden; it has to be resized without being
distorted.
`aspect-ratio` + `object-fit: cover` does both: with width 100%
and height still auto, the ratio (not the file) decides the box
height, and `cover` crops the file into that box instead of
squashing it. Any dimensions in, same tile height out.
685 / 186 is the original SD_clients.jpg, i.e. the ratio the grid
was designed around and the one still live on staging. Do not
round it to a tidier number — 685 is also exactly 50.1% of the
1366px width this grid's images were all cut at (t8's contact
image is 1366x250, t1's is 845x730 = 61.9%), so the ratios are
part of one set.
Scoped to `--t7` on purpose. The same two lines would fix any
other tile, but each column was cut at its own ratio and one of
them (t2, Featured Work) is already showing a project photo at
whatever ratio that project's image has — pinning them all now
would change tiles nobody asked about.
No mobile rule needed: below 48em the column is a fixed 160px and
`.homeGrid-box img` is `display: none`, so the tile already
renders from the `background-image` at `background-size: cover`
and is immune to the image's dimensions.
`object-position: center` matches `background-position: center` on
.homeGrid-box, so the img and the background crop identically.
TUNE HERE if a replacement image's subject sits high or low in the
frame (e.g. `object-position: center 30%`).
============================================================ */
@media screen and (min-width: 48em) {
.homeGrid-column--t7 .homeGrid-box img {
aspect-ratio: 685 / 186;
object-fit: cover;
object-position: center;
}
}