@media screen and (min-width:1921px) {
  .imageLargeCaption h2{font-size:126px; line-height:136px; letter-spacing:-5.04px;}
  .study{ width: 28%;}
  .workSpaceOne .workSpaceHalfRound{width:58%; height:189%; top:-30%;}

}

@media screen and (min-width: 0px) and (max-width:1880px) {
  .localAreaBanner h1{padding-right:6%;}
}

@media screen and (min-width: 0px) and (max-width:1810px) {
  .contactInfo h2{font-size:24px; line-height:32px;}
  .formBox h2{font-size:32px; line-height:40px;}
  ul.footerLargeMenu li a{padding:20px 10px!important;}
}

@media screen and (min-width: 0px) and (max-width:1800px) {
/* footer start here */
footer .col_20_40_40 > .col{padding:40px 20px;}
/* .formBox .gform_wrapper{padding-right:60px;} */
ul.footerLargeMenu li a{
  padding:20px 30px;
  font-size:1.40vw;
  line-height:1.50vw;
  }
ul.footerLargeMenu li a::before{right:20px;}
/* footer end here */

body.page-template-template-local-area .scrollText{left:20px;}
.maplinkList{padding:40px 20px;}
.locationDetails h2{font-size:34px; line-height:42px; letter-spacing: -1.36px;}

.floorSlide .slick-arrow.slick-prev{left:11.2vw;}
.floorSlide .slick-arrow.slick-next{right:11.2vw;}

.retailFloorsBlock .content_1640{ padding-left:80px; padding-right:80px;}

ul.footerLargeMenu li a{font-size:1.1vw;line-height:1.20vw;}

}

@media screen and (min-width: 0px) and (max-width:1780px) {
 .localAreaBanner h1{padding-right:0; font-size:36px; line-height:42px;}
}

@media screen and (min-width: 0px) and (max-width:1700px) {
  footer .investorLogo{ display: none;}

  .col_20_40_40 > .col{width: 30%;}
  .col_20_40_40 > .col.contactInfo{ width: 58%;}
  .col_20_40_40 > .col.footerlogobox{ width: 12%; padding-left: 0;}

  .footerlogobox .invstLogo, .footerLinkBottom{ display: block;}
}

@media screen and (min-width: 0px) and (max-width:1600px) {
  .LRspace{ padding: 0 80px;}
  .homeHero .bannerInfo{ margin-right: 0;}
  .scrollText,
  .homeHero .imageCaption,
  body.page-template-template-building .fullBanner .imageCaption,
  body.page-template-template-sustainability .fullBanner .imageCaption{left:80px}
  .wideImage .imageCaption{left:80px;}
  .imageLargeCaption .imageCaption{left:60px;}


  .ESGWrapper .desktopcode svg{ width: 80%; margin: 0 auto;}

  .content_820.parallaxImgBox{ width: 48%;}
  .cultureInfo.LRspace{padding-right:10vw; padding-left:10vw;}

  .localAreaBanner .content_1360,
  .foodBlock .content_1360,
  .foodimagesBlock .content_1230,
  .parkBlock .content_1360,
  .workSpaceOne .content_1360,
  .workSpaceTwo .content_1360,
  .buildingBlock .content_1360, .slideGap{ padding-left: 80px; padding-right: 80px; max-width: 1520px;}
  .slideGap::before{ right: 80px;}
  .floorIcon{ right: 160px;}

  .specBlock .grid{ padding-left: 60px; padding-right: 60px;}

  .workSpaceOne .content_1360{ padding-left: 100px; padding-right: 100px;}

  .floorSlide .slick-arrow.slick-prev{left:7.6vw;}
  .floorSlide .slick-arrow.slick-next{right:7.6vw;}

  body.page-template-template-local-area .scrollText{ display:none}
  .localAreaBanner .bannerText h1{font-size:40px; line-height: 46px; letter-spacing:-1.06px;}

  /* Retail css start here */
  .retailHeroText{left:80px; bottom:80px;}
  /* Retail css end here */
  /* .formBox .gform_wrapper{ padding-right: 60px!important;} */

  .retailUnits .floorName{padding:0 40px 0 0;}
  .retailUnits ul li{padding:0 50px 0 0;}
  .retailUnits .floorName{font-size:8vw; line-height:6vw;}
  .unitSize span{font-size:62px; line-height:70px;}

  .localAreaBanner .bannerText h1{font-size:34px; line-height:38px;}
  .foodImagecol .col:last-child .imageInfo{left:-8vw; bottom:1.5vw;}
  .foodImagecol .col:first-child .imageInfo img{width:26%;}
  .foodImagecol .col:last-child .imageInfo img{width:34%;} 

  .parkInfo{padding-left:46vw; padding-right:18vw;}
}

@media screen and (min-width: 0px) and (max-width:1570px) {
  body.page-template-template-local-area .scrollText{ left:80px; bottom: 8px}
}

@media screen and (min-width: 0px) and (max-width:1536px){
  footer .LRspace{ padding-left: 20px;}
  footer .col_20_40_40 > .col{ padding: 40px 12px;}
  .invstLogo{ max-width: 180px;}
  .contactInfo .col{ padding-left: 12px; padding-right: 12px;}
  /* .col_20_40_40 > .col:first-child, .col_20_40_40 > .col.investorLogo, .col_20_40_40 > .col.footerlogobox{width:16%;} */
  .col_20_40_40 > .col{width:28%;}

  .homeHero .bannerInfo h1{padding-bottom:10.542vw;}
  .homeHero .imageCaption{left:40px;}

  .col_20_40_40 > .col.contactInfo{ width:60%; padding-left:12px; padding-right:12px;}
  /* .col_20_40_40 > .col.contactInfo .officeEnq,
  .col_20_40_40 > .col.contactInfo .retailEnq{width:100%;} */
  .contactInfo h2{font-size:22px; line-height:30px;}
  .formBox h2{font-size:34px; line-height:42px;}
}

@media screen and (min-width: 0px) and (max-width:1500px) {
  /* building code start here */
  /* .building{width:660px;} */

  .fancybox-custom-layout .fancybox-inner .fancybox-stage .fancybox-slide{
    padding-left:60px!important;
    padding-right:60px!important;
  }

  /* .rowLevel:first-child{height:42px;}
  .rowLevel:nth-child(2){height:48px;}
  .rowLevel:nth-child(3){height:50px;}
  .rowLevel:nth-child(9){height:44px;}
  .rowLevel:nth-child(10){height:55px;}
  .rowLevel:nth-child(11){height:53px;} */
  .rowLevel{
    /* height:43px;  */
    font-size:16px; line-height:24px; letter-spacing: -0.64px;}
  .tourLink img{width:34px;}

  /* .letInfo{width:57%;}
  .tourLink,.floorNum{width:10%;}
  .floorSpace, .terraceSpace{width:11.5%;} */
  
  .floorTotal .col .floorName{max-width:108px;}
  .floorTotal{padding-top:50px;}
  /* .floorTotal .col{padding-right:50px;} */
  .floorTotal .col span{font-size:60px; line-height:68px; letter-spacing:-3.36px;}
  .floorTotal sup, .flTitle{font-size:30px; line-height:38px; letter-spacing:-1.2px;}
  .floorTotal sub{font-size:20px; line-height:24px; letter-spacing:-0.5px;}

  .floorSlide .slick-arrow.slick-prev{left:20px;}
  .floorSlide .slick-arrow.slick-next{right:20px;}


  /* building code end here */

  .floorSlide .slick-arrow.slick-prev{left:80px;}
  .floorSlide .slick-arrow.slick-next{right:80px;}
}

@media screen and (min-width: 0px) and (max-width:1480px) {
  footer .col_20_40_40 > .col.contactInfo{ padding-left:10px; padding-right:10px;}
  .contactInfo .col{padding:20px 10px;}
  .contactInfo h2{padding-left:10px;padding-right:10px;}
  .formBox{padding:30px 20px;}

  .largeCaption.TBspace{padding:120px 0;}
  .imageLargeCaption h2{font-size:4.4vw; line-height:5vw;}

  .col_36_28_36 .col:first-child, .col_36_28_36 .col:last-child{ width:26%;}
  .col_36_28_36 .col{width:48%;}

}

@media screen and (min-width: 0px) and (max-width:1400px) {

  /* sustainability start here */
  
  
  .study{ width: 32%;}

  /* sustainability start here */

  /* footer start here */
  /* footer .col_20_40_40 > .col:first-child,
  .col_20_40_40 > .col.investorLogo,
.col_20_40_40 > .col.footerlogobox{ width:24%;}
  footer .col_20_40_40 > .col{ width:52%;}
  footer .col_20_40_40 > .col:last-child{ width:52%;} */
  ul.footerLargeMenu li a::before{ width:100%; height:100%;}
  .contactInfo h2{ padding-bottom: 16px;}

  .formBox .gform_wrapper{padding-right: 0px!important;}
  /* footer end here */

  /* Retail css start here */
  .retailUnitsImage{padding-left:60px;}
  .retailUnits ul li{padding:0 32px 0 0;}
  .retailUnits{padding-bottom:40px;}
  .unitSize span{font-size:60px; line-height:68px; letter-spacing:-2.96px;}
  .unitSize sup{font-size:24px; line-height:30px; letter-spacing:-0.96px;}
  .unitSize sub{font-size:20px; line-height:28px; letter-spacing:-0.8px;}
  /* Retail css end here */
}

@media screen and (min-width: 0px) and (max-width:1366px) {
  .LRspace{padding:0 40px;}
  .scrollText,
  .homeHero .imageCaption,
  body.page-template-template-building .fullBanner .imageCaption,
  body.page-template-template-sustainability .fullBanner .imageCaption{left:40px}
  .wideImage .imageCaption{ left: 40px;}
  .zoomingIcon{right:6px; top:10px;}
  .overviewImageHolder.TBspace,
  .overviewVideoHolder.TBspace{padding-left:80px; padding-right:80px;}

  .imageLargeCaption .imageCaption{ left: 20px;}


  .contactInfo h2{ padding-left: 10px; padding-right: 10px;}
  .contactInfo .col{ padding: 20px 10px; padding-bottom:10px;}
  ul.footerLargeMenu li a{ padding: 20px 30px;}

  .CLimgTwo{margin-bottom: 30vw;}

  /* specifications start */
  .specBlock .col{ padding-left: 20px; padding-right: 20px;}
  .specBlock .col img{
    /* max-width: 170px; */
    max-height: 140px;
  }
  /* specifications end */

  /* spaceplan section start here */
  .fancybox-custom-layout .fancybox-inner .fancybox-caption{ width: 320px;}
  .fancybox-custom-layout .fancybox-inner{padding-right: 320px!important;}
  .fancybox-custom-layout .fancybox-inner .fancybox-stage { width:calc(100% - 320px);}
  .fancybox-custom-layout .fancybox-button--arrow_right{right:324px !important;}

.fancybox-custom-layout .fancybox-inner .fancybox-caption h3{font-size:36px;
    line-height:44px; letter-spacing: -1.44px;}
.fancybox-custom-layout .fancybox-inner .fancybox-caption .floorTitle{font-size:32px;
line-height:38px; letter-spacing: -1.28px;}
.fancybox-custom-layout .fancybox-inner .fancybox-caption .floorSpace{font-size:26px;
line-height:34px; letter-spacing: -1.04px;}
  /* spaceplan section end here */
.homeHero .imageCaption{ max-width: 260px;}

.localAreaBanner .content_1360{padding-left:40px; padding-right:40px;}

/* Retail css start here */
.retailHeroText{left:40px;}
.retailFloorsBlock .content_1640{padding-left:40px; padding-right:40px;}
/* Retail css end here */

.artImage .imageInfo{width:40vw; left:40px;}
.artImage .imageInfo span{width:60%;}
.artImage .imageInfo img{width:36%;} 


}

@media screen and (min-width: 0px) and (max-width:1350px) {
  ul.footerLargeMenu li{width:100%; border-right:0px; border-bottom:#fff solid 1px; height: auto;}
  ul.footerLargeMenu.two-items li{width:100%;}
  ul.footerLargeMenu li:last-child{border-bottom:0px!important;}
  ul.footerLargeMenu li a{ text-align: left;}
  ul.footerLargeMenu li a span{padding-right: 42px; padding-top: 0;
  display: inline-block;  }
  ul.footerLargeMenu li a span::after{width:22px;
  height:28px; top:50%; left:auto; margin:0; transform:translate(0,-50%); background-size:16px;}
  ul.footerLargeMenu li a{
    font-size:28px; line-height:26px;
    letter-spacing:-0.6px;
    position:relative;overflow:hidden;
  }
  .footerLargeMenu li.downloadList{border-right:0px;}

  .col_20_40_40 > .col.contactInfo .officeEnq{ width: 100%;}
  .col_20_40_40 > .col.contactInfo .retailEnq{ width: 100%;}

  .contactInfo .col{padding-top:10px;}
  .contactInfo h2{padding-bottom:10px;}
  .contactInfo .col p{padding-top:14px;}

  .specBlock .col_1_1_1_1_1 .col{ width: 25%;}
}

@media screen and (min-width: 0px) and (max-width:1280px) {
  h1{font-size:32px; line-height:40px; letter-spacing:-1.28px;}
  .unitSize span{font-size:50px; line-height:58px;}
  .retailUnits .unitSize sup, .retailUnits .unitSize sub{font-size:16px; line-height:20px;}
  .unitSize{padding-top:12px;}
  .retailUnits .floorName{font-size:64px; line-height:60px; padding:0 30px 0 0;}

  .floorTotal .col span{font-size:56px; line-height:62px;}
  .floorTotal .col{padding:28px 24px;}
  .floorTotal .col .floorName{max-width:88px;}
  .floorTotal sub{font-size:16px; line-height:20px;}
}

@media screen and (min-width: 0px) and (max-width:1279px) {

  /* local-area css start here */
  body.page-template-template-local-area .scrollText{ left:20px;}
.zoomPan{ width: 100%;}
.mapHolder{ width: 100%;}
.maplinkList{ position: relative; width: 100%; max-height:100%!important; padding:20px;}
.maplinkList ul{-moz-column-count:3; -webkit-column-count:3; -o-column-count:3; column-count:3;}
.mapLinks ul{-webkit-box-pack:flex-start;
-webkit-justify-content:flex-start;
-ms-flex-pack:flex-start;
justify-content:flex-start;
padding:20px 0;}
.mapLinks ul li{width:50%; padding:4px 20px;}
.mapLinks ul li a{font-size:22px; line-height:30px; letter-spacing: -0.88px;}
.mapLinks ul li a::before{top:2px;}
.pinch-zoom-container{height:auto !important; min-height:70vw;}
.retailMaps .pinch-zoom-container{min-height:56vw;}
.mappointer > div > span > span {display:none!important;}
  /* local-area css start here */
}

@media screen and (min-width: 0px) and (max-width:1260px) {
  /* building code start here */
  /* .building{width:560px;}
  .rowLevel:first-child{height:36px;}
  .rowLevel:nth-child(2){height:41px;}
  .rowLevel:nth-child(3){height:42px;}
  .rowLevel:nth-child(9){height:40px;}
  .rowLevel:nth-child(10){height:46px;}
  .rowLevel:nth-child(11){height:46px;} */
  .rowLevel{
    /* height:36px; */
     font-size:16px; line-height:24px; letter-spacing: -0.64px;}
  .tourLink img{width:34px;}
  .rowLevel.terraceLevel .floorNum::before,
.rowLevel.terraceLevel .floorSpace::before,
.rowLevel.terraceLevel .terraceSpace::before{font-size:16px; line-height:24px;}
  /* building code end here */
}

@media screen and (min-width: 0px) and (max-width:1180px) {
  .bannerText{padding-left:40px;}
  .localAreaBanner .bannerText h1{font-size:34px; line-height:40px; letter-spacing:-1.36px;}
  .col_20_40_40 > .col.contactInfo{width:56%;}
  .col_20_40_40 > .col{width:30%;}
  .col_20_40_40 > .col.footerlogobox{ width: 14%;}
  .contactInfo h2{padding-bottom:10px;}
  /* sustainability start here */
  .col_36_28_36 .col:first-child, .col_36_28_36 .col:last-child{width:21%;}
  .col_36_28_36 .col{width:58%;}
  .study{width:25%;}
  .col_36_28_36 .col:first-child{display:flex; align-items:flex-start; padding-top:20px;}
  /* sustainability start here */

  .localAreaBanner .bannerText h1{font-size:30px; line-height:34px;}
}

@media screen and (min-width: 0px) and (max-width:1100px) {
  /* common css start here */
  .TBspace{ padding:60px 0;}
  .LRspace{padding:0 20px;}
  .scrollText,
  .homeHero .imageCaption,
  body.page-template-template-building .fullBanner .imageCaption,
  body.page-template-template-sustainability .fullBanner .imageCaption{left:20px}
  .wideImage .imageCaption{ left: 20px;}
  .floorTotal{ padding-top: 40px;}
  .imageLargeCaption .imageCaption{ left: 20px; padding-left: 0; padding-right: 0;}
  /* common css end here */

  .localAreaBanner .content_1360,
  .foodBlock .content_1360,
  .foodimagesBlock .content_1230,
  .parkBlock .content_1360,
  .workSpaceOne .content_1360,
  .workSpaceTwo .content_1360,
  .buildingBlock .content_1360, .slideGap{padding-left:40px; padding-right:40px;}
  .slideGap::before{right:40px;}
  .floorIcon{right:120px;}

  .specBlock .grid{padding-left:20px; padding-right:20px;}

  .overviewImageHolder.TBspace,
  .overviewVideoHolder.TBspace{ padding-bottom: 60px;}
  .overviewBlock{ padding-top:80px;}
  .overviewInfo.TBspace{ padding-bottom: 80px;}

  /* building css start here */
  .floorTotal .col{padding:42px 20px 20px 20px;}
  .floorTotal .col span{font-size:56px; line-height:62px; letter-spacing: -2.96px;}
  .floorTotal sub{font-size:16px; line-height:22px; letter-spacing: -0.96px;}
  .flTitle{font-size:24px; line-height:30px; letter-spacing: -0.96px;}
  /* .floorTotal sub{font-size:20px; line-height:28px; letter-spacing: -0.8px;} */
  .floorTotal .col, .floorTotal .col:first-child, .floorTotal .col:last-child{text-align:left;}

  .floorTotal .col .floorName{ position: absolute; left:20px; top:24px; max-width: 100%;}
  /* building css end here */
  .floorSlide .slick-arrow.slick-prev{left:40px;}
  .floorSlide .slick-arrow.slick-next{right:40px;}

  /* local-area css start here */
  .localAreaBanner .content_1360{ padding-left: 20px; padding-right: 20px;}
  .localConnection.TBspace{ padding-bottom:40px;}
  .travelStation .col{
    /* width: 25%; */
    min-width: 25%; padding-bottom: 60px; }
  /* local-area css end here */

  /* sustainability start here */
  .esgInvestorlogo img{max-width:250px;}
  .wipSec.TBspace{ padding-bottom: 0px;}
  /* sustainability end here */

  .localareaHero .col:last-child .imageInfo{bottom:-10vw; right:-5vw; width:30vw;}
  .parkBlock .imagesBlock .col:first-child .imageInfo{width:26vw!important; left:1vw; bottom:14vw;}

  .parkBlock .imagesBlock .col:last-child .imageInfo{width:28vw!important; right:-14.5vw; bottom:3vw;}
  .parkBlock .imagesBlock .col:last-child .imageInfo img{width:30%;}

  /* footer start here */
  footer .col_20_40_40 > .col:first-child,
  .col_20_40_40 > .col.investorLogo,
  .col_20_40_40 > .col.footerlogobox{
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 40px 20px;
    border-bottom:#fff solid 1px;
    border-right:0px;
  }
  .col_20_40_40 > .col.footerlogobox .logoAddress{
    width:100%;
    display:flex;
  flex-direction:row;
  align-items:center;}
  .invstLogo{max-width:180px;}
  footer .col_20_40_40 > .col.footerlogobox .footerLogo{ margin-left: 0;}
  .logoAddress .address{ padding-top: 0;}
  footer .col_20_40_40 > .col{ width: 100%;}
  footer .col_20_40_40 > .col:last-child{ width:100%; border-left: 0px;}

  .contactInfo .col{ padding:10px 10px;}
  ul.footerLargeMenu li{ border-right: 0px!important;}

  footer .LRspace{ padding-left: 0;}
  ul.footerLargeMenu li a{ padding-left: 28px;}
  footer .col_20_40_40 > .col.contactInfo{ padding-left: 10px; padding-right: 10px;}

footer .col_20_40_40 > .col.footerlogobox{ border-right:0px;}
.logoAddress{padding-top:0px;}

.logoAddress .address{max-width:158px; width:100%; text-align:left; margin-right: 0px;}

.col.downloadBlock{border-top:#ffffff solid 1px;}
ul.footerLargeMenu li a::before {width:100%; height:100%;}

.col_20_40_40 > .col.contactInfo{width:100%;}
.col_20_40_40 > .col.contactInfo .officeEnq{width:66.66%;}
.col_20_40_40 > .col.contactInfo .retailEnq{width:33.33%;}
/* footer end here */

/* Retail css start here */
.retailHeroText{left:20px;}
.retailFloorsBlock .content_1640{padding-left:20px; padding-right:20px;}
/* Retail css end here */

.footerlogobox .invstLogo, .footerLinkBottom{ display: none;}
}

@media screen and (min-width: 1280px){
.pinOverlay {display:none!important;}
}

@media screen and (min-width: 0px) and (max-width: 1024px){
.zoomingIcon{ display: none;}
/* Hide Maps start */
/* .pinchzoomTip{ display: block;} */
/* Hide Maps start */
}

@media screen and (min-width: 0px) and (max-width: 1023px){
  .localAreaBanner .content_1360,
  .foodBlock .content_1360,
  .foodimagesBlock .content_1230,
  .parkBlock .content_1360,
  .workSpaceOne .content_1360,
  .workSpaceTwo .content_1360,
  .buildingBlock .content_1360, .slideGap{ padding-left: 20px; padding-right: 20px;}

  .slideGap::before{ right: 20px;}
  .floorIcon{ right: 100px;}

  .specBlock .grid{ padding-left:0px; padding-right:0px;}

  /* building code start here */
  .building .mobileImage{ display: block;}
  .building .desktopImage{ display: none;}
  .rowLevel, .rowLevel:first-child, .rowLevel:nth-child(2), .rowLevel:nth-child(3), .rowLevel:nth-child(9), .rowLevel:nth-child(10), .rowLevel:nth-child(11){
    border-bottom:#172B36 solid 1px;
    height: auto;}

  .rowLevel > div{ padding: 10px;}

  .building{position:relative; width:100%; max-width:560px; margin:0 auto;}
  .letInfo{width:24%; text-align: center;}
  .tourLink,.floorNum{width:14%; text-align: center;}
  .floorSpace, .terraceSpace{width:24%; text-align: center; justify-content: center !important;}
  .fancybox-custom-layout .fancybox-inner .fancybox-caption .floorSpace{ text-align: left;}

  .letInfo.deskView{display: none;}
  .tourLink.deskView{ display: none;}
  .letInfo.mobView{ display:block;}
  .tourLink.mobView{ display:block;}
  .tourLink.mobView .tour{ display: inline-block;}

  .specBlock .col{ width: 33.33%;}

  .rowLevel.basementLevel{ display: none;}
  .rowLevel{ padding: 0;} 
  .buildingLevelWrap{ padding-top:0;}
  .buildingLevels{padding-top:34px; width:100%;}
  .rowLevel.terraceLevel .floorSpace::before,
  .rowLevel.terraceLevel .terraceSpace::before{text-align:center;}
  /* building code end here */

  .floorSlide .slick-arrow.slick-prev{left:20px;}
  .floorSlide .slick-arrow.slick-next{right:20px;}

  .imagesSlide .slick-arrow{
    width:60px;
    height:60px;
    background-size:60px;
  }
  .imagesSlide .slick-arrow.slick-next{right:-16px;}
  .imagesSlide .slick-arrow.slick-prev{left:-16px;}

  /* Retail css start here */
  .retailFoodDrinkBlock .sectionTitle h2 br{ display: none;}
  /* Retail css end here */

  .specBlock .col_1_1_1_1_1 .col{ width:33.33%;}
}


@media screen and (min-width: 0px) and (max-width:900px) {
  /* common css start here */
  .TBspace{padding:40px 0;}
  header{padding:16px 0;}
  .logo svg, header.scroll .logo svg{width:100px; height:50px;}
  body.page-template-default #page-wrap, body.error404 #page-wrap{ padding-top:110px;}
  .specBlock.TBspace{ padding-top:40px; padding-bottom: 40px;}
  .specBlock h2{ padding-bottom: 0px;}

  .overviewImageHolder.TBspace,
  .overviewVideoHolder.TBspace{ padding-bottom:50px;}
  .overviewBlock{ padding-top:60px;}
  .overviewInfo.TBspace{ padding-bottom: 80px;}

  /* common css end here */

  .localAreaBanner .bannerText h1{font-size:24px; line-height:28px;}

  /* image captions start here */
  .imageCaption{padding:10px; font-size:16px; line-height:20px;}
  .homeHero .imageCaption{font-size:16px; line-height:20px;}
  /* image captions end here */

  /* building block start here */
  .floorTotal .col, .unitSize{padding-top:20px;}
  .floorTotal .col{ padding:40px 20px 20px 20px;}
  /* .floorTotal sup, .flTitle{font-size:20px; line-height:28px; letter-spacing:-0.8px;}
  .floorTotal .col span, .floorArea > div span{font-size:60px; line-height:68px; letter-spacing:-2.4px;}
  .floorTotal sub{font-size:16px; line-height:24px; letter-spacing:-0.64px;} */
  /* building block end here */

  /* local-area css start here */
  .travelStation .col{
    /* width:33.33%; */
    min-width: 33.33%;
  }
  /* local-area css end here */

  /* sustainability start here */
  .esgInvestorlogo{ padding-bottom: 40px;}
  /* .wipSec.TBspace .col{ padding-bottom: 40px;} */
  .specBlock .col{ padding-top:20px; padding-bottom:20px;}

  /* sustainability end here */

  /* Retail css start here */
  .retailFloorsBlock .retailUnits,
  .retailFloorsBlock .retailUnitsImage{
    width: 100%!important;
    padding-left: 0; padding-right: 0;
  }
  .retailFloorsBlock .retailUnitsImage{order:1;}
  .retailFloorsBlock .retailUnits{order:2;}
  .retailNumber{width:auto; height:26%; right:0; bottom:0;}

  .retailUnits ul{width:100%; margin:0 auto;}
  .retailFloorsBlock .retailUnitsImage{padding:0 100px;}
  .retailUnits{padding-bottom:40px;}
  .retailUnits ul li{width:50%; padding:12px 20px;}
  /* Retail css end here */



  /* footer start here */
  footer .col_20_40_40 > .col,
  .col_20_40_40 > .col:first-child,
  footer .col_20_40_40 > .col:last-child{width: 100%;}
  footer .col_20_40_40 > .col:first-child, footer .col_20_40_40 > .col{ padding:30px 20px;}
  footer .col_20_40_40 > .col:last-child{
    border-left:0px;
    border-top:0px;
    border-top:#fff solid 1px;
  }
  footer .col_20_40_40 > .col.contactInfo, .contactInfo h2{ padding-left: 10px; padding-right: 10px;}
  ul.footerLargeMenu li a{ padding-left: 20px;}

  /* footer end here */

  .retailUnits .download{right:0; margin:0 auto; width:175px;}
  .retailFloorsBlock .retailUnits{padding:20px 0 0 0;}
  .retailFloorsBlock.TBspace{padding-bottom:20px;}
  .retailUnits .flex{flex-wrap:wrap;}
  .retailUnits .floorName{order:1; width:50%; padding:12px 20px;}
  .retailFloorsBlock .retailUnits .floorIcons{order:2; width:50%; padding:12px 20px;}
  .retailUnits .floorSpaceInfo{order:3; width: 100%; }

  .floorInfoSlideHolder{padding:20px 0;}
  .floorCounterNumber{padding-right:20px;}
  .floorCounterNumber img{height:72px;}
  .floorIndicator img{height:68px;}
  .floorArea > div span{font-size:34px; line-height:34px; letter-spacing:-1.20px;}
  .flTitle{font-size:18px; line-height:18px;}
  .floorArea sub{ font-size: 14px; line-height: 14px;}


  .col_36_28_36 .col:first-child, .col_36_28_36 .col:last-child{width:15%;}
  .col_36_28_36 .col{width:70%;}

  .homeHero .imageCaption, .imageCaption{ font-size:16px!important; line-height:20px!important;}
}

/* mobile ipad css start here */
@media screen and (min-width: 0px) and (max-width: 896px) {

@media all and (orientation: landscape) {

  .homeHero .bannerInfo,
  body.page-template-template-building .bannerText,
  body.page-template-template-sustainability .bannerText{ transform:none!important;}
  body.page-template-template-building .bannerText{ z-index: 4;}
  .specBlock .col{ width: 33.33%;}

  .bannerText{padding-left:20px;}
  .bannerText h1, .homeHero .bannerInfo h1, .homeHero .bannerInfo h2{font-size:30px; line-height:36px; letter-spacing:-1.02px;}
  /* .homeHero .scrollText{ display: block; bottom: 20px;} */
  .homeHero .imageCaption,
  body.page-template-template-building .fullBanner .imageCaption,
  body.page-template-template-sustainability .fullBanner .imageCaption{ bottom: 20px;}
  .scrollText{ display: none;}
  .homeHero::before{ width:74%; height: 80%;}

  .homeHero .bannerInfo{ margin-top: 20px;}
  .homeHero .imageCaption{ font-size: 14px; line-height: 18px;}

  .bannerText{ z-index: 2;}
  .bannerText a::after{width:100%; left:0; bottom:0px; background-color:#172C35;}
  .bannerLink a::after{ background-color:#fff; width:100%; left:0; bottom:0px;}
  .bannerText a{color:#172C35;}

  .specBlock .col img{
    /* width:160px; */
    max-height:160px;
  }

  .homeHero .imageHolder::before, .homeHero .jarallax::before{
    background:rgba(23,43,53,0.5)!important;
  }
  .homeHero .bannerInfo{ margin-right: auto;}
  .homeHero .bannerInfo h1{
    padding-bottom:4vw;
    font-size:28px;
    line-height:32px;
    letter-spacing:-1.12px;
  }
  .homeHero .bannerInfo h2{font-size:24px; line-height:32px; padding-bottom:10px; letter-spacing: -0.96px;}

  .overviewInfo h2{padding-bottom:20px;}
  /* home css start here */
  .homeRecordSlide .slick-arrow.slick-prev{left:8px;}
  .homeRecordSlide .slick-arrow.slick-next{right:8px;}
  .slideInfo .box::before{ padding-top: 70%;}
  .boxInfo h2{font-size:30px; line-height:38px; padding-bottom:8px; letter-spacing:-1.2px;}
  ul.homeRecordSlide{padding-left:20px; padding-right:20px;}
  /* home css end here */

  /* local area start here */

  .localAreaBanner .bannerText{ padding-right: 0px; }
  .CLimgTwo .imageInfo span, .CLimgThree .imageInfo span, .parkBlock .imageInfo span, .localareaHero .imageInfo span, .foodImagecol .imageInfo span{font-size:1.4vw; line-height:1.8vw;}
  .localareaHero .imageInfo {width:28vw;}
  .parkBlock .imagesBlock .col:first-child{ padding-left: 20px; padding-right: 20px;}
  .parkBlock .imagesBlock .col:first-child .imageInfo {width:20vw;}
  .parkBlock .imagesBlock .col:last-child .imageInfo{width:25vw;}
  .parkBlock::after{height:60%;}
  .parkTitle{margin-top:-6vw;}
  .parkTitle h2{line-height:28vw;}
  .foodImagecol .imageInfo{width:26vw; margin-top:-6vw;}
  .foodImagecol .imageInfo span{font-size:1.4vw; line-height:1.8vw;}
  .artImageHolder{margin-top:-30vw;}
  .artImage .imageInfo{top:4vw; width:34vw;}
  .artImage .imageInfo span{font-size:1.8vw; line-height:2.4vw;}

  .CLimgTwo{ margin-bottom: 32vw;}
  .londonConnection .introBlock{ padding-bottom: 40px;}
  .travelStation .grid{ padding-top: 40px;}
  body.page-template-template-local-area .largeCaption{padding: 14vw 0;}
  body.page-template-template-home .largeCaption,
  body.page-template-template-building .largeCaption{padding: 10vw 0;}
  /* local area start here */

  .fancybox-navigation .fancybox-button--arrow_left{ padding-right: 30px!important;}
.fancybox-navigation .fancybox-button--arrow_right{ padding-left: 30px!important;}
.fancybox-custom-layout .fancybox-inner .fancybox-caption h3{font-size:30px;
line-height:38px; letter-spacing:-1.2px;}
.floorTitle{font-size:26px; line-height:34px;}
.fancybox-custom-layout .fancybox-inner .fancybox-caption .floorSpace {font-size:24px; line-height:30px; letter-spacing: -0.96px;}

  /* sustainability start here */
  .esgCommit h2{ font-size:40px; line-height: 48px; padding-bottom: 30px; letter-spacing: -1.6px;}
  /* sustainability end here */

  body.error404 #page-wrap::before{width:60vw; height:48vw;}
  .formBox{ padding-left:20px; padding-right: 20px;}
  ul.footerLargeMenu li a{ padding-left:20px; padding-right: 20px;}
  ul.footerLargeMenu li a::before{
  opacity:1;
  width:36px;
  height:28px;
  background-size:36px;
  background-position: center center;
  right:auto;
  left:20px;
}
  ul.footerLargeMenu li a:hover::after{ right: -100%;}

  .retailHeroText{left:0; bottom:20px;}
  .retailHeroText .bannerLink{padding-top:16px;}
  .retailMaps .mapHolder{ min-height: auto;}
  .retailMaps .pinch-zoom-container {
   min-height: 56vw;
   height: auto;
 }
}

@media all and (orientation: portrait) {

  /* new branding changes start */
  body.page-template-template-home .largeCaption::after{display: none!important;}
  /* new branding changes end */

  /* main banners start here */
  .scrollText{display:none;}
  /* .homeHero .scrollText{display:block; bottom:40px;} */
  .homeHero .imageCaption,
  body.page-template-template-building .fullBanner .imageCaption,
  body.page-template-template-sustainability .fullBanner .imageCaption{bottom:40px; z-index: 9;}
  .fullBanner{height:auto;}
  .fullBanner.homeHero, .fullBanner.retailBanner{height:100vh;}

  .fullBanner.retailBanner::before{background:rgba(35,84,105,0.5)!important;}

  .homeHero .imageCaption{ max-width: 320px; bottom: 30px;}

  body.page-template-template-building header.scroll .logoColor,
  body.page-template-template-sustainability header.scroll .logoColor{fill:#ffffff;}

  .homeHero::before{clip-path: polygon(0 0, 100% 63%, 100% 100%, 0 100%);width: 100%; height:16%;}
  .homeHero .bannerInfo{ margin-right:auto; text-align: center;}

  .bannerText a::after{width:100%; left:0; bottom:0px; background-color:#172C35;}
  .bannerLink a::after{ background-color:#fff; width:100%; left:0; bottom:0px;}
  .bannerText a{color:#172C35;}

  body.page-template-template-building .fullBanner .imageCaption,
  body.page-template-template-sustainability .fullBanner .imageCaption{
    padding: 10px; left: 0; bottom: 0px;
  }
  /* main banners end here */

  /* home page start here */
.homeHero .bannerInfo h1{ padding-bottom: 10vw;}
  .homeHero .imageHolder::before, .homeHero .jarallax::before{
    background:rgba(23,43,54,0.5)!important;
  }
  .overviewImageHolder.TBspace,
  .overviewVideoHolder.TBspace{padding-left:30px; padding-right:30px;}
  .overviewImageHolder .box::before{ padding-top: 54%;}

  .retailFoodDrinkBlock .content_1360{ padding-left: 50px; padding-right: 50px;}

  .overviewBlock{
    /* padding-top:0px; */
     padding-bottom: 60vw;}
  .overviewBlock .patternBlock{display: none;}
  .overviewBlock::before{width:100%; height:92%;}
  .overviewImageHolder.TBspace,
  .overviewVideoHolder.TBspace{ padding-bottom:50px;}
  .overviewInfo.TBspace{ padding-bottom: 80px;}

  .content_820.parallaxImgBox{ width: 80%; top: -60vw;}
  .parallaxImgBox .box::before{ padding-top: 100%;}

  .slideInfo h2{ font-size: 35px; line-height: 42px; letter-spacing: -1.4px;}

  .homeOne .jarallax{height:20vh!important;}
  .homeOne .jarallax .jarallax-img, .ladyimageparallax .jarallax .jarallax-img{object-position:right!important;}
  .homeOne::before, .topcurveAngle{
    /* display:block; */
    display: none;
  }
  .largeCaption.grayPattern{background-size:140px;}

  .boxInfo{padding:30px;}
  .mobileSlider{padding:40px 20px;}
  .homeRecordSlide .slick-arrow.slick-prev{left:-10px;}
  .homeRecordSlide .slick-arrow.slick-next{right:-10px;}
  .homeRecordSlide .slick-arrow:hover {background-color:#86E0C7;}
  /* home page end here */

  /* local area start here */

  .localareaHero .col:last-child{ z-index: 2;}

  .foodImagecol .col:first-child, .foodImagecol .col:last-child{width:100%;}
  .foodImagecol .col:first-child{padding-right:0; padding-bottom:60px;}
  .foodImagecol .col:last-child{padding-top:0; padding-left:0; padding-bottom:60px;}

  .parkTitle, .foodTitle{ z-index: 2;}
  .parkTitle h2, .foodTitle h2{ text-align: center; left: auto; right:auto;}
  .parkTitle h2{ font-size:30vw; line-height:20vw; left:0; text-align:center; position:relative;}
  .foodTitle h2{font-size:33vw; line-height:22.2vw; left:0; position: relative;}
  .parkInfo{ padding-left:20vw; padding-right:20vw; font-size:4vw; line-height:4.2vw; bottom:7vw;}
  .foodTitle{ padding-bottom:4%;}
  .foodInfo{padding-left:12vw; padding-right:12vw; font-size:4vw; line-height:4.4vw; bottom:10vw;}
  .foodInfo br{ display: none;}
  .foodBlock{padding-top:60px;}
  .foodLargeImage .imageTitle{text-align: left;}
  .foodLargeImage .imageTitle b, .foodLargeImage .imageTitle strong{ width: 100%; display: block;}
  .foodLargeImage .box::before{ padding-top: 70%;}
  .foodTitle{ margin-top: 0;}
  .maplinkList ul{-moz-column-count:2; -webkit-column-count:2; -o-column-count:2; column-count:2;}

  .foodimagesBlock .rightCircle{ height:70%; top:8%; width: 50%;}


  .foodImagecol.TBspace{padding-top:40px;}
  .foodImagecol .imageInfo{width:100%; padding:0;}
  .foodImagecol .imageInfo img{ width:35%!important;}
  .foodImagecol .imageInfo span{width: 100%; padding-left: 20px;}
  .foodImagecol .imageInfo span b, .foodImagecol .imageInfo span strong{ display:block;}
  .foodImagecol .imageInfo span br{display:none;}
  .foodImagecol .col:last-child .imagebox:first-child{display:none;}
  .foodImagecol .col:first-child .imageInfo{margin-left:0; width:50vw; bottom:2vw;}
  .foodImagecol .col:last-child .imageInfo{margin-right:0; flex-direction:row-reverse; align-content: space-between; align-items: flex-end;}
  .foodImagecol .col:last-child .imageInfo span{width: 100%; padding-left: 0; padding-bottom: 4vw;}
  .leftTriangle{ display: none;}

  .rightTriangle{width:116%; height:100%;}
  .artBlock{flex-wrap:wrap; padding-top: 0; z-index: 4; margin-top: -20%;}
  .artImage{width:100%; padding-bottom:40px;}
  .artImage .imageInfo img{ margin-bottom:0;}
  .artImageHolder{margin-top:0;}
  .artTitle{width:100%; padding-bottom:2%; margin-bottom:-2%;}
  .artImage .imageInfo span b, 
  .artImage .imageInfo span strong{font-size:26px; line-height:24px;}

  

  .artImage .imageInfo{width:70vw; top:auto; bottom:10vw; right:0; left:0; padding:0 24px; align-items:center;}
  .artImage .imageInfo img{ width: 44%;}
  .artTitle h2{font-size:44vw; line-height:32vw; right:0; text-align:center;}

  .wideImage{background-color:#172B36; z-index: auto;}
  .wideImage .box{ z-index: 3;}
  .wideImage .box::before{padding-top:60%;}

  .circleHolder::before{ width:80vw; height:80vw; left:-22%; right: auto; background-size:140px; top:-5%; z-index: 2;}
  .cultureTitle{padding-bottom: 14vw;}
  .cultureTitle h2{font-size:22.5vw; line-height:19vw;}
  .cultureInfo{font-size:6.4vw; padding:0 6vw; line-height:6.4vw; transform: translate(0,0); bottom:3vw; top:auto;}
  .cultureInfo.LRspace{padding-right:6vw;}
  .cultureInfo br{ display: none;}

  .CLimgOne{display:none;}
  .CLimgTwo, .CLimgThree{width:100%; padding-bottom:60px; margin-left: 0;}
  .CLimgTwo{margin-bottom:0; padding-top: 60px;}
  .CLimgThree{margin-left:0;}
  .CLimgTwo .box::before{padding-top:60%;}
  .CLimgTwo .imageInfo{ top:auto; bottom: 0; right: 0; flex-direction: row-reverse;}
  .CLimgThree .imageInfo{ top:auto; bottom: 0;}

  .CLimgTwo .imageInfo, .CLimgThree .imageInfo{ position: relative; width: 100%; margin-top: -16vw; padding: 0 4vw; align-items: flex-end;}
  .CLimgTwo .imageInfo img, .CLimgThree .imageInfo img{ width: 22%;}
  .CLimgTwo .imageInfo span, .CLimgThree .imageInfo span{transform:translate(0,0); padding-left: 20px;}
  .CLimgTwo .imageInfo span{ padding-left: 0; padding-right: 20px;}
  .CLimgTwo .imageInfo span b, .CLimgTwo .imageInfo span strong, .CLimgThree .imageInfo span b, .CLimgThree .imageInfo span strong{ display: block;}
  .CLimgTwo .imageInfo span br, .CLimgThree .imageInfo span br{ display:none;}
  .circleHolder{ 
    /* padding-bottom: 40%; */
    padding-bottom: 0;
  }
  .coupleImage{ left: 0; right: 0; margin: 0 auto;
    /* height: 40vw; */
    width:42%;
  }
  .rope-barricade{ position: absolute; bottom: 0;}

  .travelStation{padding-top:40px;}
  .introBlock{text-align:center;}
  .travelStation .grid{padding-top:40px;}
  .parkBlock .graybg{height:40%;}

  .locationDetails h2{text-align:center; padding-bottom:30px;}
  .travelStation h2{ text-align: center;}

  .locationIcon img{max-height: 20px;
position: absolute;
left: 50%;
transform: translateX(-50%);
height: 10px;}

.travelStation .locationIcon img{height:14px;}
.travelStation .col{padding-bottom:46px;}
.localConnection.TBspace{padding-bottom:30px;}
.foodImagecol .col:last-child .imageInfo img{width:17.2%!important;}

.foodImagecol .col:last-child .imageInfo{width:100%; left:0;}

.cultureBlock > .darkBlueBG.TBspace{padding-bottom: calc(4% + 40px);}
  /* local area end here */

  /* sustainability start here */
  .study.desktopview{ display: none;}
  .study.respview{ display:block;}

  .imageInfoBlock .col, .col_36_28_36 .col:last-child{ width: 100%;}
  .imageInfoBlock .col:first-child{ display: none;}
  .study{width:80%; position:relative; margin:0 auto; z-index:1; bottom:-40px;}
  .wipSec.TBspace{padding-bottom:40px;}
  /* sustainability end here */

  /* Building page start */
  .heroBlock .box{ z-index:4;}
  .ourWorkBlock .col, .ourWorkBlock .col:first-child{ width: 100%; padding-left: 0; padding-right: 0;}
  .imageTitle{text-align:center;}
  .coupleSmall{display:none;}
  .workSpaceTwo .triangle{width:40%; height:24%;}
  .ourWorkBlock .col:first-child{display: none;}
  .workSpaceTwo .Largetriangle{
    bottom:auto;
    /* top:0;  */
    top:-60%!important;
    width:170%;
    /* height:80%; */
    height:140%;
  }
  .workSpaceOne .workSpaceHalfRound{ top:-34%;}
  .workSpaceTwo .TBspace{padding-top:60px; padding-bottom:60px;}
  .workSpaceOne.TBspace{ padding-top: 60px; padding-bottom: 0px;}

  .workSpaceTwo .circle{display:none;}
  .mapHolder{ height: auto; min-height: auto;}
  #MapImagesrc{ width: 100%; max-width: none!important;}

  .floorSlide .slick-arrow{ top:50%;}
  .floorSlide .slick-arrow.slick-prev{ left: 10px;}
  .floorSlide .slick-arrow.slick-next{ right: 10px; left: auto;}
  .floorArea > div{ padding-right:30px;}
  .slideGap .slideImage{ padding:0 60px; display: block;}
  /* .slideGap{ padding-bottom: 120px;} */
  .slideGap::before, .floorIcon{ bottom: 24px;}
  .floorIcon{width:160px;}
  .slideNumber{width:auto; height:50%; left:-2%; top:0;}
  .fancybox-custom-layout .fancybox-inner{ padding-right: 0;}
  .fancybox-custom-layout .fancybox-inner .fancybox-stage{width:100%;}
  .fancybox-custom-layout .fancybox-inner .fancybox-caption {
    right:-100%;
    left:auto;
    width: 100%;
  }
  body.showCaption .fancybox-custom-layout .fancybox-inner .fancybox-caption{right:0;}
  .fancybox-custom-layout .fancybox-inner .fancybox-stage .fancybox-slide{
    padding:40px 60px!important;}
  .fancybox-custom-layout .fancybox-navigation .fancybox-button--arrow_right{ right: 0px!important; left: auto!important;}
  body.showbtn .bottomfixBox{opacity:1; visibility:visible;}
  .fancybox-custom-layout .fancybox-caption__body{ height: calc(100% - 56px);}
  .fancybox-custom-layout .fancybox-inner .fancybox-caption::before{ opacity: 0.1;}

  .workSpaceOne .box::before{ padding-top:60%;}
  .imagesSlide .box::before{ padding-top:50%!important;}
  .imagesSlide .slick-arrow {width:50px; height:50px; background-size:50px;}
  /* Building page end */

  /* flplan popup start here */

  /* flplan popup end here */

  /* paralax image text start */
  .parallax80 .jarallax, .parallax100 .jarallax{ height:40vh;}
  .imageLargeCaption h2{ font-size: 50px; line-height:54px; letter-spacing: -2px;}
  .largeCaption.TBspace{ padding-top: 100px; padding-bottom: 100px;}

  body.page-template-template-building .largeCaption::after{width:36%; height:60%;}
  body.page-template-template-building .largeCaption::before,
  body.page-template-template-retail .shapeBox::before{ width: 60vw; height: 60vw;}

  body.page-template-template-home .imageLargeCaption::after{ display: none;}
  body.page-template-template-home .largeCaption::after{ display:block;
  clip-path: polygon(100% 0, 0% 100%, 100% 100%);
  height: 100%;
  width: 50%;
  right: 0;}
  /* paralax image text end */

  .specBlock .col img{
    /* width:160px; */
    max-height:120px;
  }

  body.error404 #page-wrap::before{width:60vw; height:50vw;}

  .logowrapper{max-width:70%;}

  .formBox{ padding-left:20px; padding-right: 20px;}
  ul.footerLargeMenu li a{ padding-left:20px; padding-right: 20px;}
  ul.footerLargeMenu li a::before{
    opacity:1;
    width:36px;
    height:28px;
    background-size:36px;
    background-position: center center;
    right:auto;
    left:20px;
  }
  ul.footerLargeMenu li a:hover::after{ right: -100%;}

  .homeHero .jarallax-img{object-position:66% 50%!important;}
  .fullBanner.homeHero, .fullBanner.retailBanner{height:90vh;}
  .homeHero .bannerInfo{margin-top:-40%;}
  .page-template-template-sustainability .heroBlock .imageHolder img{object-position:left center;}
  .fullBanner.retailBanner::before{background:rgba(23,43,54,0.5)!important;}

  /* retailBanner start here */
  .retailHeroText {
   left: 0;
   right: 0;
   margin: 0 auto;
   text-align: center;
   transform: translate(0, -50%);
   top: 50%;
   bottom: auto;
   height: auto;
 }
 .retailHeroText h1{font-size:44px; line-height:52px;}

 .retailFoodDrinkBlock .sectionTitle h2{
   font-size:34px;
   line-height:42px;
   padding-bottom:20px;
 }
  /* retailBanner end here */

  
}

}
/* mobile ipad css end here */

@media all and (device-width: 1024px) and (device-height: 1366px) and (orientation:portrait) {
  /* main banners start here */
  .scrollText{ display: none;}
  .homeHero .scrollText{ display: none;}
  /* .homeHero .scrollText{ display: block; bottom: 20px;} */
  .homeHero .imageCaption{bottom: 20px;}
  body.page-template-template-building .fullBanner .imageCaption,
  body.page-template-template-sustainability .fullBanner .imageCaption{ z-index: 9;}
  .fullBanner{height: auto;}
  .fullBanner.homeHero, .fullBanner.retailBanner{ height: 100vh;}
  .fullBanner.retailBanner::before{background:rgba(35,84,105,0.5)!important;}


  body.page-template-template-building .logoColor,
  body.page-template-template-sustainability .logoColor{fill:#172C35;}
  body.page-template-template-building header.scroll .logoColor,
  body.page-template-template-sustainability header.scroll .logoColor{fill:#ffffff;}
  .homeHero .imageHolder::before, .homeHero .jarallax::before{
    background:rgba(35,84,105,0.5)!important;
  }

  .homeHero::before{clip-path: polygon(0 0, 100% 63%, 100% 100%, 0 100%); width: 100%; height:16%;}

  .homeHero .bannerInfo{ margin-right:auto; text-align:center;}

  .bannerText a::after{width:100%; left:0; bottom:0px; background-color:#172C35;}
  .bannerLink a::after{ background-color:#fff; width:100%; left:0; bottom:0px;}
  .bannerText a{color:#172C35;}
  /* main banners end here */

  .homeOne::before, .topcurveAngle {display:block;}
  .boxInfo{padding:30px;}
  .mobileSlider{padding:40px 20px;}
  .homeRecordSlide .slick-arrow.slick-prev{left:-10px;}
  .homeRecordSlide .slick-arrow.slick-next{right:-10px;}

  /* local area start here */

  .localareaHero .col:last-child{ z-index: 2;}

  .foodImagecol .col:first-child, .foodImagecol .col:last-child{width:100%;}
  .foodImagecol .col:first-child{padding-right:0; padding-bottom:60px;}
  .foodImagecol .col:last-child{padding-top:0; padding-left:0; padding-bottom:60px;}

  .parkTitle, .foodTitle{ z-index: 2;}
  .parkTitle h2, .foodTitle h2{ text-align: center; left: auto; right:auto;}
  .parkTitle h2{ font-size:30vw; line-height:20vw; left:0; position: relative; text-align: center;}
  .foodTitle h2{font-size:33vw; line-height:22.2vw; left:0; position: relative;}
  .parkInfo{ padding-left:20vw; padding-right:20vw; font-size:4vw; line-height:4.2vw; bottom:4%;}
  .foodTitle{ padding-bottom:4%;}
  .foodInfo{padding-left:12vw; padding-right:12vw; font-size:4vw; line-height:4.4vw; bottom:10vw;}
  .foodInfo br{ display: none;}
  .foodBlock{padding-top:60px;}
  .foodLargeImage .box::before{ padding-top: 70%;}
  .foodTitle{ margin-top: 0;}
  .maplinkList ul{-moz-column-count:2; -webkit-column-count:2; -o-column-count:2; column-count:2;}

  .foodimagesBlock .rightCircle{ height:70%; top:8%; width: 50%;}

  .foodLargeImage .imageTitle{ text-align: left;}
  .foodImagecol.TBspace{ padding-top: 60px;}
  /* .foodImagecol .imageInfo{width:100%; padding:0 4vw; margin-top:-12vw;} */
  .foodImagecol .imageInfo img{ width: 26%!important;}
  .foodImagecol .col:last-child .imageInfo img {
    width: 17.2% !important;
  }
  .foodImagecol .imageInfo span{width: 100%; padding-left: 20px;}
  .foodImagecol .imageInfo span b, .foodImagecol .imageInfo span strong{ display:block;}
  .foodImagecol .imageInfo span br{display:none;}
  .foodImagecol .col:last-child .imagebox:first-child{display:none;}
  .foodImagecol .col:first-child .imageInfo{margin-left: 0;
    width: 50vw;
    bottom: 2vw;}
  .foodImagecol .col:last-child .imageInfo{
    margin-right:0; 
    flex-direction:row-reverse;
    align-content: space-between; 
    align-items: flex-end;
    width: 100%;
    left: 0;
  }
  .foodImagecol .col:last-child .imageInfo span{width: 100%; padding-left: 0; padding-bottom: 4vw;}
  .leftTriangle{ display: none;}

  .rightTriangle{width:116%; height:100%;}
  .artBlock{flex-wrap:wrap; padding-top: 0; z-index: 4; margin-top:-20%;}
  .artImage{width:100%; padding-bottom:40px;}
  .artImage .imageInfo img{ margin-bottom:0; width: 44%;}
  .artImageHolder{margin-top:0;}
  .artTitle{width:100%; padding-bottom:2%; margin-bottom:-2%;}

  .artImage .imageInfo{ width: 70vw;
    top: auto;
    bottom: 10vw;
    right: 0;
    left: 0;
    padding: 0 24px;
    align-items: center;}
  .artImage .imageInfo span b, .artImage .imageInfo span strong{font-size:3vw; line-height:2.8vw;}
  .artTitle h2{font-size:44vw; line-height:32vw; right:-2.1vw;}

  .wideImage{ background-color:#FEE03A; z-index: auto;}
  .wideImage .box{ z-index: 3;}
  .wideImage .box::before{padding-top:60%;}

  .circleHolder::before{ width:80vw; height:80vw; left:-22%; right: auto; background-size:140px; top:-5%; z-index: 2;}
  .cultureTitle{padding-bottom: 14vw;}
  .cultureInfo{font-size:6.4vw; padding:0 6vw; line-height:6.4vw; transform: translate(0,0); bottom:3vw; top:auto;}
  .cultureInfo.LRspace{ padding-right: 6vw;}
  .cultureInfo br{ display: none;}

  .CLimgOne{display:none;}
  .CLimgTwo, .CLimgThree{width:100%; padding-bottom:60px; margin-left:0;}
  .CLimgTwo{margin-bottom:0; padding-top: 60px;}
  .CLimgThree{margin-left:0;}
  .CLimgTwo .box::before{padding-top:60%;}
  .CLimgTwo .imageInfo{ top:auto; bottom: 0; right: 0; flex-direction: row-reverse;}
  .CLimgThree .imageInfo{ top:auto; bottom: 0;}

  .CLimgTwo .imageInfo, .CLimgThree .imageInfo{ position: relative; width: 100%; margin-top: -16vw; padding: 0 4vw; align-items: flex-end;}
  .CLimgTwo .imageInfo img, .CLimgThree .imageInfo img{ width: 22%;}
  .CLimgTwo .imageInfo span, .CLimgThree .imageInfo span{transform:translate(0,0); padding-left: 20px;}
  .CLimgTwo .imageInfo span{ padding-left: 0; padding-right: 20px;}
  .CLimgTwo .imageInfo span b, .CLimgTwo .imageInfo span strong, .CLimgThree .imageInfo span b, .CLimgThree .imageInfo span strong{ display: block;}
  .CLimgTwo .imageInfo span br, .CLimgThree .imageInfo span br{ display:none;}
  .circleHolder{ 
    /* padding-bottom: 40%; */
    padding-bottom: 0;
  }
  .coupleImage{left:0; right:0; margin:0 auto;
    /* height:40vw; */
    width:42%;
  }
  .rope-barricade{ position: absolute; bottom: 0;}

  .travelStation{padding-top:40px;}
  .introBlock{text-align:center;}
  .travelStation .grid{padding-top:40px;}
  .parkBlock .graybg{height:40%;}

  .locationDetails h2{text-align:center; padding-bottom:30px;}
  .travelStation h2{ text-align: center;}

  .cultureBlock > .darkBlueBG.TBspace{padding-bottom: calc(4% + 40px);}
  /* local area end here */

  /* Building page start */
  .heroBlock .box{ z-index:4;}
  .ourWorkBlock .col, .ourWorkBlock .col:first-child{ width: 100%; padding-left: 0; padding-right: 0;}
  .imageTitle{text-align:center;}
  .coupleSmall{display:none;}
  .workSpaceTwo .triangle{width:40%; height:24%;}
  .ourWorkBlock .col:first-child{display: none;}
  .workSpaceTwo .Largetriangle{bottom:auto; top:0; width:170%; height:80%;}
  .workSpaceOne .workSpaceHalfRound{ top:-34%;}
  .workSpaceTwo .TBspace{padding-top:60px; padding-bottom:60px;}
  .workSpaceOne.TBspace{padding-top:60px; padding-bottom:0;}
  .workSpaceTwo .circle{display:none;}
  .mapHolder{ height: auto; min-height: auto;}
  #MapImagesrc{ width: 100%; max-width: none!important;}

  .floorSlide .slick-arrow{ top:50%;}
  .floorSlide .slick-arrow.slick-prev{ left: 10px;}
  .floorSlide .slick-arrow.slick-next{ right: 10px; left: auto;}
  .floorArea > div{ padding-right:30px;}
  .slideGap .slideImage{ padding:0 40px; display: block;}
  /* .slideGap{ padding-bottom: 120px;} */
  .slideGap::before, .floorIcon{ bottom: 24px;}
  .floorIcon{ width: 160px;}
  .slideNumber{width:auto; height:50%; left:-2%; top:0;}
  .fancybox-custom-layout .fancybox-inner{ padding-right: 0;}
  .fancybox-custom-layout .fancybox-inner .fancybox-stage{width:100%;}
  .fancybox-custom-layout .fancybox-inner .fancybox-caption {
    right:-100%;
    left:auto;
    width: 100%;
  }
  body.showCaption .fancybox-custom-layout .fancybox-inner .fancybox-caption{right:0;}
  .fancybox-custom-layout .fancybox-inner .fancybox-stage .fancybox-slide{
    padding:40px!important;}
  .fancybox-custom-layout .fancybox-navigation .fancybox-button--arrow_right{ right: 0px!important; left: auto!important;}
  body.showbtn .bottomfixBox{opacity:1; visibility:visible;}
  .fancybox-custom-layout .fancybox-caption__body{ height: calc(100% - 56px);}

  .imagesSlide .slick-arrow.slick-prev{left:-32px;}
  .imagesSlide .slick-arrow.slick-next{right:-32px;}
  /* Building page end */

  /* paralax image text start */
  .parallax80 .jarallax, .parallax100 .jarallax{ height:40vh;}
  .imageLargeCaption h2{ font-size: 50px; line-height:54px; letter-spacing: -2px;}
  .largeCaption.TBspace{ padding-top: 100px; padding-bottom: 100px;}

  body.page-template-template-building .largeCaption::after{width:36%; height:60%;}
  body.page-template-template-building .largeCaption::before,
  body.page-template-template-retail .shapeBox::before{ width: 60vw; height: 60vw;}

  body.page-template-template-home .imageLargeCaption::after{ display: none;}
  body.page-template-template-home .largeCaption::after{ display:block;
  clip-path: polygon(100% 0, 0% 100%, 100% 100%);
  height: 100%;
  width: 50%;
  right: 0;}
  /* paralax image text end */

  .parallax80 .jarallax, .parallax100 .jarallax{ height:40vh;}

  .specBlock .col img{
    /* width:160px; */
    max-height:120px;
  }

  body.error404 #page-wrap::before{width:60vw; height:50vw;}

  ul.footerLargeMenu li a::before{
  opacity:1;
  width:36px;
  height:28px;
  background-size:36px;
  background-position: center center;
  right:auto;
  left:20px;
}
.formBox{ padding-left:20px; padding-right: 20px;}
ul.footerLargeMenu li a{ padding-left:20px; padding-right: 20px;}

/* retailBanner start here */
.retailHeroText {
 left: 0;
 right: 0;
 margin: 0 auto;
 text-align: center;
 transform: translate(0, -50%);
 top: 50%;
 bottom: auto;
 height: auto;
}
.retailHeroText h1{font-size:44px; line-height:52px;}
/* retailBanner end here */

.retailFoodDrinkBlock .sectionTitle h2{
  font-size:40px;
  line-height:50px;
  padding-bottom:20px;
}

.retailFloorsBlock .retailUnits,
.retailFloorsBlock .retailUnitsImage{
  width: 100%!important;
  padding-left: 0; padding-right: 0;
}
.retailFloorsBlock .retailUnitsImage{order:1;}
.retailFloorsBlock .retailUnits{order:2;}
.retailNumber{width:auto; height:26%; right:0; bottom:0;}

.retailUnits ul{width:70%; margin:0 auto;}
.retailFloorsBlock .retailUnitsImage{padding:0 100px;}
.retailUnits{padding-bottom:40px;}
.retailUnits ul li{width:50%; padding:20px;}

}

@media all and (device-width:810px) and (device-height:1080px) and (orientation:portrait),
all and (device-width:820px) and (device-height:1180px) and (orientation:portrait),
all and (device-width:768px) and (device-height:1024px) and (orientation:portrait),
all and (device-width:834px) and (device-height:1194px) and (orientation:portrait),
all and (device-width:1024px) and (device-height:1366px) and (orientation:portrait) {
  /* .heroBlock{ padding-top:120px;} */
  .bannerText {
  padding: 0 20px 80px 20px !important;
  text-align: center;
  max-width: 80%;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}
.localareaHero .bannerText{ padding-bottom: 0px!important; text-align: left;}

.imageTextBlock h2{ font-size:42px; line-height:50px; letter-spacing:-1.68px; padding-bottom: 12px;}
  /* local area start here */
  .zoomingIcon{ display: flex;}
  .pinchzoomTip{ display: none;}

  .imageTextBlock .col{min-height:40vh;}
  .maplinkList ul{-moz-column-count:3; -webkit-column-count:3; -o-column-count:3; column-count:3;}
  .maplinkList ul{column-gap: 6px;}
  .maplinkList ul li{ padding:4px 0 6px 30px; padding-right: -2px; font-size: 16px; line-height:24px; letter-spacing: -0.64px;}

  .localAreaBanner{padding-top:86px;}
  .localAreaBanner .bannerText h1{font-size:26px; line-height:32px; padding-bottom:14px; letter-spacing:-1.12px;}
  .localAreaBanner .bannerText a{font-size:16px; line-height:24px; letter-spacing:-0.5px;}
  .imageTextBlock .linkBox a, .localAreaBanner .bannerText a{padding:4px 14px;}
  .parkBlock .graybg{ height:22%;}

  .foodImagecol .col:first-child{ padding-right: 20%;}
  .foodImagecol .col:last-child{ padding-left: 20%;}

  .CLimgTwo .imageInfo span, .CLimgThree .imageInfo span, .parkBlock .imageInfo span, .localareaHero .imageInfo span, .foodImagecol .imageInfo span {padding-left:10px; font-size:1.8vw; line-height:2vw;}

  .localareaHero .imageInfo{width:28vw;}
  .parkBlock .imagesBlock .col:first-child .imageInfo{width:18vw;}
  .parkBlock .imagesBlock .col:last-child .imageInfo{width:26vw;}
  /* local area end here */

  /* hero section start here */
  .col_64_36 .col{width:40%;}
  .col_64_36 .col:last-child{width:60%;}
  .heroBlock .box::before{padding-top:100%;}
  .heroBlock .bannerText{max-width:100%; padding-bottom: 40px; text-align: left;}
  /* hero section end here */

  .ESGWrapper.TBspace{padding-top:60px; padding-bottom:60px;}

  /* retailBanner start here */
  .retailHeroText {
   left: 0;
   right: 0;
   margin: 0 auto;
   text-align: center;
   transform: translate(0, -50%);
   top: 50%;
   bottom: auto;
   height: auto;
 }
 .retailHeroText h1{font-size:44px; line-height:52px;}
  /* retailBanner end here */
}

@media all and (device-width: 1024px) and (device-height: 768px) and (orientation:landscape),
all and (device-width: 1180px) and (device-height: 820px) and (orientation:landscape),
all and (device-width: 1080px) and (device-height: 810px) and (orientation:landscape),
all and (device-width: 1194px) and (device-height: 834px) and (orientation:landscape),
all and (device-width: 1366px) and (device-height: 1024px) and (orientation:landscape)
{
  .zoomingIcon{ display: flex;}
  .pinchzoomTip{ display: none;}

  .localareaHero .bannerText{padding-left:40px;}
  .bannerText{padding-left:20px;}
  .bannerText h1{font-size:36px; line-height:42px; letter-spacing:-1.44px;}
  .heroBlock::after{height:40%;}
  .content_820.parallaxImgBox{width:50%;}

  .boxInfo{padding:30px;}
  .mobileSlider{padding:40px 20px;}
  .homeRecordSlide .slick-arrow.slick-prev{left:-10px;}
  .homeRecordSlide .slick-arrow.slick-next{right:-10px;}
  .homeOne::before, .topcurveAngle {display: block;}

  /* local area start here */
  .localAreaBanner .scrollText{ bottom: 8px;}
  .CLimgTwo .imageInfo span, .CLimgThree .imageInfo span, .parkBlock .imageInfo span, .localareaHero .imageInfo span, .foodImagecol .imageInfo span{
    font-size:1.4vw; line-height:1.8vw;
  }

  .travelStation{padding-top:40px;}
  .localareaHero .imageInfo{width:28vw;}
  .parkBlock .imagesBlock .col:first-child .imageInfo{width: 20vw;}
  .parkBlock .imagesBlock .col:last-child .imageInfo{width: 25vw;}
  .parkBlock::after{height:60%;}
  .parkTitle{margin-top:-6vw;}
  .parkTitle h2{line-height:28vw;}

  .foodImagecol .imageInfo{width:26vw; margin-top:-6vw;}
  .CLimgTwo{margin-bottom: 32vw;}

  .artImageHolder{margin-top: -30vw;}
  .artImage .imageInfo{ top:8vw; width:34vw;}
  body.page-template-template-local-area .largeCaption{padding: 14vw 0;}
  /* local area end here */

  /* footer start here */
  footer .col_20_40_40 > .col:first-child,
  .col_20_40_40 > .col.investorLogo,
  .col_20_40_40 > .col.footerlogobox{
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 40px 20px;
    border-bottom:#fff solid 1px;
  }
  .col_20_40_40 > .col.footerlogobox .logoAddress{
  width: 100%;
  display: flex;
flex-direction: row;
align-items: center;}
footer .col_20_40_40 > .col.footerlogobox .footerLogo {
  margin-left: 0;
}
.logoAddress .address {
  padding-top: 0;
}
  footer .col_20_40_40 > .col{width:50%;}
  footer .col_20_40_40 > .col:last-child{border-left:0px; width:50%}
  footer .col_20_40_40 > .col.contactInfo{border-right:#fff solid 1px;}
  footer .col_20_40_40 > .col.downloadBlock{border-top:0px;}
  .formBox{ padding-left: 20px; padding-right: 20px;}

  .contactInfo .col{ padding:10px 10px;}

  footer .LRspace{ padding-left: 0;}
  ul.footerLargeMenu li a{ padding-left: 28px;}
  footer .col_20_40_40 > .col.contactInfo{ padding-left: 10px; padding-right: 10px;}
  ul.footerLargeMenu li a{ padding-left:20px; padding-right: 20px;}
  ul.footerLargeMenu li a::before{
  opacity:1;
  width:36px;
  height:28px;
  background-size:36px;
  background-position: center center;
  right:auto;
  left:20px;
}
.logoAddress .address{ margin-right: 0; margin-left: 0; width: 100%; max-width: 158px;}

footer .col_20_40_40 > .col.contactInfo{width:50%;}
.col_20_40_40 > .col.contactInfo .officeEnq,
.col_20_40_40 > .col.contactInfo .retailEnq{width:100%!important;}
footer .col_20_40_40 > .col.downloadBlock{justify-content: flex-start;}
  /* footer end here */

  body.error404 #page-wrap::before{width:56vw; height:40vw;}

  .logowrapper {max-width: 40%;}
  ul.footerLargeMenu li a:hover::after{ right: -100%;}

  .imagesSlide .slick-arrow{
    width:70px;
    height:70px;
    background-size:70px;
  }
  .imagesSlide .slick-arrow.slick-next{right:-35px;}
  .imagesSlide .slick-arrow.slick-prev{left:-35px;}

  .retailFloorsBlock .content_1640{ padding-left: 80px; padding-right: 80px;}
  .retailFoodDrinkBlock .sectionTitle h2{font-size:42px; line-height:54px;}

  .localareaHero .col:last-child .imageInfo {bottom:11vw; right:-24vw; width:26vw;}
}

@media all and (device-width: 810px) and (device-height: 1080px) and (orientation:landscape){
  ul.footerLargeMenu li a {
    padding-left: 74px;
  }
  ul.footerLargeMenu li a::before{opacity: 1;
width: 36px;
height: 28px;
background-size: 36px;
background-position: center center;
right: auto;
left: 20px;}
ul.footerLargeMenu li a:hover::after{ right: -100%;}

footer .col_20_40_40 > .col{width:50%;}
footer .col_20_40_40 > .col:last-child{border-left:0px; width:50%}
footer .col_20_40_40 > .col.contactInfo{border-right:#fff solid 1px;}
footer .col_20_40_40 > .col.downloadBlock{border-top:0px;}
.formBox{ padding-left: 20px; padding-right: 20px;}
ul.footerLargeMenu li a{padding: 20px 20px;}

footer .col_20_40_40 > .col.contactInfo{width:50%;}
.col_20_40_40 > .col.contactInfo .officeEnq,
.col_20_40_40 > .col.contactInfo .retailEnq{
  width: 100%;
}

.imagesSlide .slick-arrow{
  width:70px;
  height:70px;
  background-size:70px;
}
.imagesSlide .slick-arrow.slick-next{right:-35px;}
.imagesSlide .slick-arrow.slick-prev{left:-35px;}

.retailFloorsBlock .content_1640{ padding-left: 80px; padding-right: 80px;}

footer .col_20_40_40 > .col.downloadBlock{justify-content: flex-start;}

.retailFoodDrinkBlock .sectionTitle h2{font-size:42px; line-height:54px;}

.localareaHero .col:last-child .imageInfo {bottom:11vw; right:-24vw; width:26vw;}
}

@media screen and (min-width: 0px) and (max-width:767px) and (orientation:portrait) {
  /* local area top section start here */

  .localAreaBanner, .heroBlock{ padding-top:120px;}
  .bannerText{ padding: 0 20px 80px 20px!important; text-align: center; max-width:80%; margin: 0 auto; position: relative; z-index: 2;}
  .localAreaBanner .bannerText{ padding-top: 0;}
  .localAreaBanner{ padding-bottom:80px;}
  .localAreaBanner::after{ content:''; width: 100%; height: 20%; background-color:#fff; position: absolute; left: 0; bottom: 0; display: none;}

  .localareaHero .col:first-child,
  .localareaHero .col:last-child{ width: 100%;}
  .localareaHero .box::before{padding-top:70%;}
  .localAreaBanner::before{
  right:0;
  top:0;
  left:auto;
  bottom:auto;
  clip-path:polygon(0 0, 100% 100%, 100% 0);
  width:110%;
  height:50%;
  }
  .parkBlock::before{clip-path: polygon(0 0, 0 100%, 100% 0); width:80%; height:40%; top:-30vw; left:0;}
  .parkBlock .imagesBlock .col{width:100%;}

  .localareaHero .imageInfo{width:100%; right:0; display:flex; flex-direction:row-reverse; padding:0 4vw;}
  .localareaHero .imageInfo img{width:22%;}

  .localareaHero .imageInfo span,
  .parkBlock .imageInfo span,
  .foodImagecol .imageInfo span,
  .CLimgTwo .imageInfo span,
  .CLimgThree .imageInfo span{font-size:18px; line-height:22px; letter-spacing:-0.8px;}

  .localareaHero .imageInfo span{ margin-right: auto; padding-left:0;}

  .parkBlock.TBspace{padding-top:60px;}
  .parkBlock .imagesBlock .col:first-child{margin-top:0; padding:0 0 18vw 0;}
  .parkBlock .imagesBlock .col:first-child .box::before{padding-top:70%;}
  .parkBlock .imagesBlock .col:first-child .imageInfo{ width:35vw!important; left: 2vw; margin-top: -15vw; display: flex; align-items: flex-end;}
  .parkBlock .imagesBlock .col:first-child .imageInfo img{ width: 9vw;}
  .parkBlock .imageInfo span{transform:translate(0,0);}

  .parkBlock .imagesBlock .col:last-child .imageInfo{right:0; top:-12vw; bottom:auto; width:34vw!important;}
  .parkBlock::after{height:61%; width:50%;}

  .foodBlock::before{width:50%;}
  /* local area top section end here */

  /* building block start here */
  /* .floorTotal .col{padding-top:14px; padding-right:26px;} */
  .floorTotal sup, .flTitle{font-size:18px; line-height:22px; letter-spacing: -0.72px;}
  .floorTotal .col span{font-size:50px; line-height:52px; letter-spacing: -2px;}
  .floorTotal sub{font-size:16px; line-height:24px; letter-spacing: -0.64px;}

  .workSpaceOne .box::before{ padding-top: 70%;}
  /* building block end here */

  /* hero section start here */
  body.page-template-template-building .logoColor,
  body.page-template-template-sustainability .logoColor{fill:#172C35;}
  body.page-template-template-sustainability .heroBlock::after{
    left:0;
    top:0;
    clip-path:polygon(0 0, 0% 100%, 100% 0);
    width:110%;
    height:70%;
    background-color:#86E0C7;
  }
  body.page-template-template-sustainability .heroBlock .box{ z-index: 2;}
  body.page-template-template-sustainability .heroBlock .box::before{ padding-top: 120%;}

  body.page-template-template-building .heroBlock .box::before{ padding-top:100%;}

  .col_64_36 .col,
  .col_64_36 .col:last-child{ width: 100%;}
  /* hero section end here */

  /* sustainability start */
  .esgMobile, .esgTitleHolder{ display:block;}
  .ESGWrapper.TBspace{ padding-top:42vw;}
  .ESGWrapper .desktopcode, .study.desktopview{ display: none;}
  /* sustainability end */

  /* .londonConnection .mobileCode{ display: block;}
  .londonConnection .desktopcode{ display: none;} */
}

@media screen and (min-width: 0px) and (max-width:767px) {
.retailHeroText h1{font-size:32px; line-height:38px;}
.col_20_40_40 > .col.contactInfo .officeEnq,
.col_20_40_40 > .col.contactInfo .retailEnq{ width: 100%;}
.contactInfo h2{font-size:30px;
  line-height:38px;
  letter-spacing:-0.4px;}
  .formBox h2{font-size:40px;
  line-height:48px;}

.streetInfo .desktopImage{display:none;}
.streetInfo .mobileImage{display:block!important; max-width:360px; margin:0 auto;}

.streetInfo{padding:14px 0;}
.viewLocalArea{padding:20px 0 24px 0; font-size:16px; line-height: 24px;}

/* Retail css start here */
.retailFloorsBlock .retailUnitsImage{padding:0 60px;}
/* .retailUnits ul{width:80%;} */
.retailUnits ul li{padding:14px;}
.retailParallaxImage .jarallax-img{object-position:left center!important;}
/* Retail css end here */

.floorDetail{flex-wrap:wrap; position: relative;}
.floorCounterNumber{width:100%; padding-right:0;}
.floorArea{width:100%; padding-top:14px;}
.floorIndicator{position:absolute; right:0; top:0;}
.floorCounterNumber img{height:48px;}
.floorIndicator img{height:52px;}

.localAreaBanner{}
.localAreaBanner .bannerText h1{padding-right:0; font-size:30px; line-height:38px;}

.localareaHero .col:last-child .imageInfo{width:100%; right:0;}
.localareaHero .col:last-child .imageInfo img{width:24%;}

.parkBlock .imagesBlock .col:first-child .imageInfo{bottom:6vw; width:90%!important;}
.parkBlock .imagesBlock .col:last-child .imageInfo img{width:50%;}

.localareaHero .imageInfo span b, .localareaHero .imageInfo span strong,
.parkBlock .imageInfo span b, .parkBlock .imageInfo span strong,
.foodImagecol .col:first-child .imageInfo span b, .foodImagecol .col:first-child .imageInfo span strong,
.foodImagecol .col:last-child .imageInfo span b, .foodImagecol .col:last-child .imageInfo span strong,
 .CLimgTwo .imageInfo span b, .CLimgTwo .imageInfo span strong, 
.CLimgThree .imageInfo span b, .CLimgThree .imageInfo span strong{
  font-size:24px; 
  line-height:28px; 
  color:#87E0C7;
}

.foodImagecol .col:first-child{padding-bottom:40px;}
.foodImagecol .col:first-child .imageInfo{width:100%;}
.foodImagecol .col:first-child .imageInfo img{width:18%!important;}
.foodImagecol .col:last-child .imageInfo img{width:20%;}

.artBlock{margin-top:-10%;}

}

@media screen and (min-width: 0px) and (max-width:640px) {
  .gform_wrapper.gravity-theme input:not([type="radio"]):not([type="checkbox"]):not([type="image"]):not([type="file"]){
     line-height:24px!important;
   }
  h1{font-size:48px; line-height:54px; letter-spacing:-1.92px;}
  h2, .esgCommit h2{font-size:42px; line-height:50px; letter-spacing: -1.6px;}
  .homeHero .bannerInfo h2{ font-size:26px; line-height:34px; letter-spacing: -1.52px;}
  .homeHero .bannerLink{ font-size: 18px; line-height: 26px; letter-spacing: -0.72px;}
  .alignleft, .alignright, .aligncenter {margin: 10px auto 30px auto !important; display: block; float: none;}

  .logo svg, header.scroll .logo svg {width:90px; height:44px;}

  /* building block start here */
  .floorTotal{justify-content:center; flex-direction:column; align-content:center;}
  .floorTotal .col{ 
    /* padding-top:24px; padding-right: 0px; padding-bottom:20px; */
    padding: 48px 20px 20px 20px;
  }
  .floorTotal .col span{font-size:74px; line-height:70px; letter-spacing: -2.96px;}
  .floorTotal sup{font-size:26px; line-height:30px; letter-spacing: -1.04px;}
  .floorTotal sub{ font-size:18px; line-height:24px; letter-spacing: -0.88px;}

  .specBlock .grid .col:nth-child(odd){padding-right:10px;}
  .specBlock .grid .col:nth-child(even){padding-left:10px;}
  /* building block end here */

  .specBlock .col{width:50%;}

  .overviewImageHolder.TBspace,
  .overviewVideoHolder.TBspace{ padding-left: 0; padding-right: 0;}
  .overviewBlock{padding-bottom:70vw;}
  .content_820.parallaxImgBox{ width: 100%; top:-70vw;}

  .mappointer div > span{
    width:20px;
    height:20px;
    font-size:10px;
    line-height:18px;
    letter-spacing:-0.4px;
  }

  .retailFoodDrinkBlock .colorPatch{ height: calc(24% + 20px);}
  .retailFloorsBlock .retailUnitsImage{ padding:0;}
  .retailUnits ul{ /* width:90%; */}
  .retailFoodDrinkBlock .content_1360{padding-left:20px; padding-right:20px;}
  .retailFloorsBlock .retailImage .download{position:relative; left:0; top:0; padding-bottom:14px; text-align:center;}

  .floorTotal .col{width:100%;}

  .specBlock .col_1_1_1_1_1 .col{ width:50%;}
}

@media screen and (min-width: 0px) and (max-width:667px) and (orientation:landscape) {
  .esgCommit h2{font-size: 30px; line-height:38px; padding-bottom: 20px; letter-spacing: -1.2px;}
  .col_36_28_36 .col{ padding: 0 10px;}

  .localAreaBanner .bannerText{ padding-top: 0px;}
  .localAreaBanner .bannerText h1{
    font-size:22px;
    line-height:28px;
    padding-bottom:14px;
    letter-spacing:-0.88px;
  }
  .localAreaBanner .bannerText a{ font-size: 18px; line-height: 24px; letter-spacing: -0.72px;}
}

@media screen and (min-width: 0px) and (max-width:550px) {
  h1{font-size:35px; line-height:42px; letter-spacing:-1.4px;}
  h2, .esgCommit h2{font-size:32px; line-height:40px; letter-spacing:-1.28px;}
  h3{font-size:30px; line-height:38px; padding-bottom:12px; letter-spacing: 1.2px;}
  h4{font-size:28px; line-height:36px; letter-spacing: -1.12px;}
  h5{font-size:26px; line-height:34px; letter-spacing: -1.04px;}
  h6{font-size:24px; line-height:32px; letter-spacing: -0.96px;}

  .imageInfoBlock{ font-size: 15px; line-height: 22px; letter-spacing: -0.6px;}
  .imageInfoBlock p{ padding-bottom: 20px;}

  .homeHero .bannerInfo h1{font-size:32px; line-height:38px; letter-spacing:-1.4px;}
  .homeHero .bannerInfo h2{ font-size:28px; line-height:36px; letter-spacing: -1px;}
  .bannerText{padding:0 20px 60px 20px!important; max-width:90%;}

  .largeCaption.TBspace{padding-top:60px; padding-bottom:60px;}
  .imageLargeCaption h2{font-size:42px; line-height:48px; letter-spacing: -1.68px;}
  .imageLargeCaption .content_1100{ padding-left: 10px; padding-right: 10px;}

  .slick-arrow{width:32px!important; height:32px!important; min-width:32px!important; background-size:28px!important;}

  .fancybox-navigation .fancybox-button--arrow_left{ padding-right: 40px!important;}
  .fancybox-navigation .fancybox-button--arrow_right{ padding-left: 40px!important;}
  .fancybox-navigation .fancybox-button div{ padding: 2px!important;}

  .floorTitle{font-size:26px; line-height:34px; letter-spacing: -1.04px;}
  .fancybox-custom-layout .fancybox-inner .fancybox-caption .floorSpace{font-size:24px; line-height:30px; letter-spacing: -0.96px;}
  .fancybox-custom-layout .fancybox-inner .fancybox-caption h3,
  .floorTitle,
  .fancybox-custom-layout .fancybox-inner .fancybox-caption .floorSpace{ padding-bottom: 6px;}

  /* home css start here */
  .homeHero .bannerInfo h1 {padding-bottom:10vw;}
  .overviewImageHolder.TBspace,
  .overviewVideoHolder.TBspace{ padding-bottom:24px;}
  .overviewInfo.TBspace{ padding-bottom:50px;}
  body.page-template-template-home .imageLargeCaption::before{width:60vw;
height:60vw; left:-30%;}
  .homeRecordSlide .box::before{padding-top:70%;}
  .boxInfo{padding:30px 20px; font-size:16px; line-height:24px; letter-spacing: -0.64px;}
  .homeRecordSlide .boxInfo .linkBox{padding-top:20px;}
  .mobileSlider{ padding-left: 0px; padding-right: 0px;}
  .homeRecordSlide .slick-arrow.slick-prev{left:10px;}
  .homeRecordSlide .slick-arrow.slick-next{right:10px;}
  /* home css end here */

  /* paralax image text start */
  body.page-template-template-building .largeCaption::before,
  body.page-template-template-retail .shapeBox::before{width:100vw; height:100vw; left: -100%;}
  @keyframes buildingCircle {
    0%{opacity:0; left:-100%;}
    100%{opacity:1; left:-50%;}
  }
  @-webkit-keyframes buildingCircle {
    0%{opacity:0; left:-100%;}
    100%{opacity:1; left:-50%;}
  }
  body.page-template-template-building .largeCaption::after{width:40%; height:60%;}
  /* paralax image text end */

  .specBlock .col{ width:50%;}
  .specBlock .col img{
    /* width:110px; */
    max-height:110px;
  }
  .iconInfo{font-size:15px; line-height:22px; letter-spacing: -0.6px; padding-top:18px;}

  /* sustainability start here */
  .esgMobile .col{padding-bottom:28px;}
  .esgMobile{font-size:15px; line-height:22px; letter-spacing: -0.6px;}
  .esgMobile .col{padding-bottom:38px;}
  .esgMobile .col h3{ font-size: 20px; line-height:28px; letter-spacing: -0.8px; letter-spacing: 0.8px; padding-bottom:14px;}
  .esgMobile .col:last-child{padding-bottom:18px;}
  .ESGWrapper.TBspace{padding-top:48vw;}
  .study{bottom:-30px; width:100%;}
  .esgCommit h2{padding-bottom:26px;}

  .specBlock.TBspace{padding-top:20px; padding-bottom:20px;}
  .specBlock.wipSec.TBspace{ padding-bottom:60px;}
  /* sustainability end here */

  /* local area start here */
  .mapLinks ul{padding:20px 10px;}
  .mapLinks ul li{padding:2px 10px;}
  .mapLinks ul li a{font-size:16px; line-height:24px; letter-spacing: -0.64px;}
  .mapLinks ul li a::before{ top:0;}
  .travelStation .col{
    width:50%;
    min-width: 50%;
  }
  .locationIcon img{ height: 7px;}

  .parkBlock.TBspace,
  .foodBlock,
  .foodImagecol.TBspace,
  .CLimgTwo{ padding-top:50px;}

  .localAreaBanner,
  .foodImagecol .col:first-child,
  .foodImagecol .col:last-child,
  .CLimgTwo, .CLimgThree{padding-bottom:50px;}

  .parkBlock .imagesBlock .col:first-child{ padding-bottom:60px;}

  .foodInfo, .cultureInfo, .cultureInfo.LRspace{ padding-left: 20px; padding-right: 20px;}

  .localareaHero .imageInfo,
  .foodImagecol .imageInfo,
  .foodImagecol .imageInfo,
  .CLimgTwo .imageInfo,
  .CLimgThree .imageInfo{ padding:0 10px;}

  .localareaHero .imageInfo span, .parkBlock .imageInfo span, .foodImagecol .imageInfo span, .CLimgTwo .imageInfo span, .CLimgThree .imageInfo span, .foodLargeImage .imageTitle, .artImage .imageInfo span{font-size:15px; line-height:20px; letter-spacing: -0.6px;}

  .localareaHero .imageInfo{bottom:-15vw;}
  .localareaHero .imageInfo span{transform: translate(0,60%);}
  .localareaHero .imageInfo img{ width: 30%;}

  .parkBlock::before{width:94%; height:45%; top:-50vw;}
  .parkBlock::after{height:53%;}
  .parkBlock .graybg{height:32%;}
  .parkBlock .imagesBlock .col:first-child .imageInfo{width:46vw;}
  .parkBlock .imagesBlock .col:first-child .imageInfo img{width:12vw;}
  .parkBlock .imagesBlock .col:first-child .imageInfo{margin-top:-22vw;}
  .parkBlock .imagesBlock .col:last-child  .imageInfo span{display:none;}
  .parkBlock .imagesBlock .col:last-child  .imageInfo img{width:100%;}
  .parkBlock .imagesBlock .col:last-child .imageInfo{width:24vw!important;}
  .parkTitle{margin-top:-1vw;}

  .wideImage{ padding-left: 20px; padding-right: 20px;}
  .wideImage .viewElm{ transform: scale(1)!important; left: 0px!important;}
  .wideImage .imageHolder{transform: translateX(0)!important;}

  .foodLargeImage .imageTitle{padding:10px 20px; max-width: 100%;}
  /* .foodImagecol .imageInfo{margin-top:-20vw;} */
  .foodImagecol .imageInfo img{width:40%!important;}
  .foodImagecol .imageInfo span{padding-left:10px;}
  .foodimagesBlock .rightCircle{height:58%; top:14%; width:48%;}
  .foodImagecol .col:last-child{padding-bottom:30px;}
  .foodImagecol .col:last-child .imageInfo span{padding-bottom:0px;}

  .artImage{width:100%; padding-bottom:20px;}
  .artImage .imageInfo{right:-14vw; bottom:14vw; width:80vw;}
  .artImageHolder .box{transform: scale(1.4);}
  .artImageHolder .box .imageHolder{ top:-40px}

  .CLimgTwo .imageInfo, .CLimgThree .imageInfo{margin-top:-15vw;}
  .CLimgTwo .imageInfo img, .CLimgThree .imageInfo img{width:22%;}
  .CLimgTwo .imageInfo span{padding-right:10px;}
  .CLimgThree .imageInfo span{padding-left:10px;}

  .mapLinks ul li{ padding:2px 4px}
  .mapLinks ul li a{ padding-left: 26px;}
  .maplinkList ul{column-gap: 6px;}
  .maplinkList ul li{ padding:4px 0 6px 30px; padding-right: -2px; font-size: 16px; line-height:24px; letter-spacing: -0.64px;}
  .locationDetails h2{ padding-bottom: 22px;}
  .travelStation .grid{  padding-top: 30px;}
  .travelStation .col{ padding: 0 8px 40px 8px;}
  .travelStation .col h3, .travelStation .col .subTitle{ font-size: 16px; line-height: 22px; letter-spacing: -0.64px;}

  .pinchzoomTip{text-align:left; padding:14px 14px 14px 64px; background-position:18px center; font-size:12px; line-height:18px;}

  .localareaHero .imageInfo span b, .localareaHero .imageInfo span strong,
.parkBlock .imageInfo span b, .parkBlock .imageInfo span strong,
.foodImagecol .col:first-child .imageInfo span b, .foodImagecol .col:first-child .imageInfo span strong,
.foodImagecol .col:last-child .imageInfo span b, .foodImagecol .col:last-child .imageInfo span strong,
 .CLimgTwo .imageInfo span b, .CLimgTwo .imageInfo span strong, 
.CLimgThree .imageInfo span b, .CLimgThree .imageInfo span strong{
  font-size:18px; 
  line-height:22px; 
  color:#87E0C7;
}

.parkInfo{ padding-left:32px; padding-right:32px; font-size:5vw; line-height:6vw; text-align:center; bottom:-2vw;}
.foodInfo{padding-left:32px; padding-right:32px; font-size:4.5vw; line-height:5.5vw; text-align:center; bottom:2vw;}

.foodImagecol .col:first-child{padding-bottom:30px;}
.foodImagecol .col:last-child .imageInfo{bottom:4vw;}
.foodImagecol .col:first-child .imageInfo img{width:22%!important;}
.foodImagecol .col:last-child .imageInfo img{width:22%!important;}

  /* local area start here */


  /* building code start here */
  /* .buildingBlock .content_1360{ padding-left: 0px; padding-right: 0px;} */
  .building{ padding-left: 20px; padding-right: 20px;}

  .tourLink,.floorNum{width:20%;}
  .floorSpace, .terraceSpace{width:40%;}
  .workSpaceTwo .TBspace{padding-top:40px; padding-bottom:40px;}
  .workSpaceOne.TBspace{ padding-top:40px;}
  .workSpaceTwo::before{
    /* height: calc(100% - 25%); */
    height: 100%;
  }
  /* .floorArea > div:last-child{display: none;} */

  .spaceplanLink ul, .spaceplanLink ul li:first-child{padding-left:6px;}
  .spaceplanLink{font-size:12px; line-height:16px; letter-spacing:-0.48px;}
  /* .floorArea > div span{font-size:36px; line-height:44px; letter-spacing:-1.44px;} */
  .floorArea sub{font-size:14px; line-height:20px; letter-spacing: -0.56px;}
  .flTitle{font-size:14px; line-height:20px; letter-spacing: -0.56px;}
  .floorArea > div{padding-right:10px;}
  .floorDetail{padding-bottom:20px;}
  .download{font-size:16px; line-height:20px; padding-top:6px; letter-spacing: -0.64px;}
  .download a{padding-right:40px;}
  .download a::before{width:36px; height:22px; background-size:24px;}

  .slideGap .slideImage{padding:0 40px;}
  .download a span svg{width: 40px;
height: 18px;}
  /* building code end here */

  .retailFoodDrinkBlock .sectionTitle h2{
    font-size:32px;
    line-height:40px;
    padding-bottom:20px;
  }

  .retailUnits ul{ width: 100%;}
  .retailUnits .floorName, .retailFloorsBlock .retailUnits .floorIcons{ padding:12px;}
  .retailUnits ul li{padding: 12px;}
  .unitSize{ padding-top: 18px;}
  .unitSize span{font-size:48px;
    line-height:56px;}
    .unitSize sub{font-size: 18px;
    line-height: 26px;}
    .unitSize sup{font-size: 21px;
    line-height: 28px;}

  /* footer start here */
  footer .col_20_40_40 > .col:last-child{border-bottom:#fff solid 1px;}
  .logoBox{padding-bottom:12px;}
  .contactInfo .col{width:100%; padding:0 0 34px 0;}
  .retailEnq{padding-top:34px;}
  .contactInfo .col p{padding:14px 0 4px 0;}
  .contactInfo .col:last-child{padding-bottom: 0;}
  .copyrightBox.dektopView{display:none;}
  .copyrightBox.mobileView{display:block;}
  ul.footerLargeMenu li a{font-size:32px; line-height:40px; letter-spacing:-1.28px; padding-top:16px; padding-bottom:16px;}
  .invstLogo{max-width:140px;}

  .contactInfo h2{padding:0 0 20px 0;}
  footer .col_20_40_40 > .col.contactInfo{ padding-left: 20px; padding-right: 20px;}

  .col_20_40_40 > .col.footerlogobox .logoAddress{flex-wrap:wrap;}
  .logoAddress .address{width:100%; text-align:left; padding-top:0px;}

  ul.footerLargeMenu li{ width: 100%;}
  ul.footerLargeMenu.two-items li{width:100%;}
  .retailUnits{padding-bottom: 58px;}
  /* footer end here */

  body.error404 #page-wrap::before{width:80vw; height:80vw;}
  .rowLevel.terraceLevel .floorNum::before,
.rowLevel.terraceLevel .floorSpace::before,
.rowLevel.terraceLevel .terraceSpace::before{ font-size: 14px; line-height: 18px;}

.footerLogo{max-width:110px;}
.logoAddress .address{ max-width:150px;}
.formBox .gform_wrapper{ padding-right: 0px!important;}

.imagesSlide .slick-arrow {width:40px!important; height:40px!important; background-size:40px!important; margin-top: -20px!important;}
.imagesSlide .slick-arrow.slick-prev{left: -14px;}
.imagesSlide .slick-arrow.slick-next{ right: -14px;}

.esgCommit .TBspace{padding:40px 0 60px 0;}

.slideGap .planDownloads .download a{padding: 4px 12px; font-size: 12px; line-height: 20px;}
.CLimgTwo{ padding-bottom: 20px;}

.overviewInfo br{ display: none;}
}

@media screen and (min-width: 0px) and (max-width:420px) {
  .retailUnits ul li{width:100%;}

  .retailUnits .floorName, .retailUnits ul li, .retailFloorsBlock .retailUnits .floorIcons{ padding: 12px 10px;}
}

@media all and (device-width:568px) and (device-height:320px) and (orientation:landscape){
  .homeHero .bannerInfo h1, .homeHero .bannerInfo h2{
    font-size:24px;
    line-height:30px;
    padding-bottom:8px;
    letter-spacing:-0.96px;
  }
  .bannerText h1{font-size:22px; line-height:30px; letter-spacing: -0.88px;}
}

@media screen and (min-width: 0px) and (max-width:390px) {
  .homeHero .imageCaption{bottom:20px;}
  .rowLevel{font-size:14px; line-height:24px; letter-spacing: -0.56px;}
  .rowLevel > div{ padding: 10px 4px;}
}

@media screen and (min-width: 0px) and (max-width:380px) {
  .imageLargeCaption h2{font-size: 10.5vw; line-height: 11.5vw;}
}
@media screen and (min-width: 0px) and (max-width:375px) {
  .maplinkList ul{ column-gap:4px;}
  .maplinkList ul li{font-size:15px; line-height:24px; letter-spacing: -0.6px; padding-right: 2px;}
}

@media screen and (min-width: 0px) and (max-width:370px) {
  .logowrapper {max-width: 50%;}
  .bannerText{max-width:100%;}
  .localareaHero .col:first-child .bannerText{padding-left:0px!important; padding-right: 0px!important;}
  .homeHero .bannerInfo h1{font-size:28px;line-height:34px; letter-spacing:-1.12px; padding-bottom: 12px;}
  .homeHero .bannerInfo h2{font-size:26px; line-height:34px; letter-spacing:-1px; padding-bottom: 12px;}
  .retailHeroText h1{ font-size:28px;line-height:34px; letter-spacing:-1.12px;}
  .retailHeroText h1 br{display:none;}

  .retailUnits ul li{ padding: 8px;}
  .unitSize span{font-size:60px; line-height:68px; letter-spacing:-2.96px;}
  .unitSize sup {font-size:20px; line-height:38px; letter-spacing:-0.96px;}
  .unitSize sub{font-size:18px; line-height:24px;}
}