@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:1800px) {
  /* footer start here */
  footer .col_20_40_40 > .col{padding:40px 20px;}
  ul.footerLargeMenu li a{padding:20px 38px; padding-right:100px;}
  ul.footerLargeMenu li a::before{ right: 20px;}
  /* footer end here */
  
  body.page-template-template-local-area .scrollText{left: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{left:14.8vw;}
  }
  
  @media screen and (min-width: 0px) and (max-width:1600px) {
    .LRspace{ padding: 0 80px;}
    .homeHero .bannerInfo{ margin-right: 0;}
    .scrollText{ left: 80px}
  
    .ESGWrapper .desktopcode svg{ width: 80%; margin: 0 auto;}
  
    .content_820.parallaxImgBox{ width: 48%;}
    .cultureInfo.LRspace{padding-right: 28vw;}
  
    .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;}
  
    .floorSlide .slick-arrow.slick-prev{left:7.6vw;}
    .floorSlide .slick-arrow.slick-next{left:11.6vw;}
  
    body.page-template-template-local-area .scrollText{ display:none}
    .localAreaBanner .bannerText h1{font-size:40px; line-height: 46px; letter-spacing:-1.06px;}
  }
  
  @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: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{padding-top:50px;}
    .floorTotal .col{padding-right:50px;}
    .floorTotal .col span, .floorArea > div span{font-size:84px; line-height:92px; letter-spacing: -3.36px;}
    .floorTotal sup, .flTitle{font-size:30px; line-height:38px; letter-spacing: -1.2px;}
    .floorTotal sub{font-size:24px; line-height:32px; letter-spacing: -0.96px;}
  
    .floorSlide .slick-arrow.slick-prev{left:20px;}
    .floorSlide .slick-arrow.slick-next{left:84px;}
    /* building code end here */
  
    .floorSlide .slick-arrow.slick-prev{left:80px;}
    .floorSlide .slick-arrow.slick-next{left:140px;}
  }
  
  @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;}
  }
  
  @media screen and (min-width: 0px) and (max-width:1400px) {
  
    /* sustainability start here */
    .col_36_28_36 .col:first-child, .col_36_28_36 .col:last-child{ width:30%;}
    .col_36_28_36 .col{ width:40%;}
    .study{ width: 32%;}
  
    /* sustainability start here */
  
    /* footer start here */
    footer .col_20_40_40 > .col:first-child{ width:19%;}
    footer .col_20_40_40 > .col{ width:48%;}
    footer .col_20_40_40 > .col:last-child{ width:33%;}
    ul.footerLargeMenu li a, .contactInfo h2{ font-size: 40px; line-height: 48px; letter-spacing:-1.6px;}
    ul.footerLargeMenu li a::before{ width:50px; height: 33px;}
    .contactInfo h2{ padding-bottom: 16px;}
    /* footer end here */
  }
  
  @media screen and (min-width: 0px) and (max-width:1366px) {
    .LRspace{padding:0 40px;}
    .scrollText{left:40px}
    .overviewImageHolder.TBspace{padding-left:80px; padding-right:80px;}
  
  
    .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: 170px;
    }
    /* 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 */
  
  }
  
  /* @media screen and (min-width: 0px) and (max-width:1280px) {
    h1{font-size:32px; line-height:40px; letter-spacing:-1.28px;}
  } */
  
  @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%;}

    /* 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;}
    /* 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;}
  
  
    /* sustainability start here */
    .col_36_28_36 .col:first-child, .col_36_28_36 .col:last-child{ width:25%;}
    .col_36_28_36 .col{ width:50%;}
    .study{ width:25%;}
    .col_36_28_36 .col:first-child{ display: flex; align-items: flex-start; padding-top: 20px;}
    /* sustainability start here */
  }
  
  @media screen and (min-width: 0px) and (max-width:1100px) {
    /* common css start here */
    .TBspace{ padding:60px 0;}
    .LRspace{padding:0 20px;}
    .scrollText{left:20px}
    .floorTotal{ padding-top: 40px;}
    /* 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{ padding-bottom: 60px;}
    .overviewBlock{ padding-top:80px;}
    .overviewInfo.TBspace{ padding-bottom: 80px;}
  
    /* building css start here */
    .floorTotal .col{padding-top:26px; padding-right: 38px;}
    .floorTotal .col span, .floorArea > div span{font-size:74px; line-height:80px; letter-spacing: -2.96px;}
    .floorTotal sup, .flTitle{font-size:24px; line-height:30px; letter-spacing: -0.96px;}
    .floorTotal sub{font-size:20px; line-height:28px; letter-spacing: -0.8px;}
    /* building css end here */
    .floorSlide .slick-arrow.slick-prev{left:40px;}
    .floorSlide .slick-arrow.slick-next{left:100px;}
  
    /* local-area css start here */
    .localConnection.TBspace{ padding-bottom:40px;}
    .travelStation .col{ 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 */
  
    /* footer start here */
    footer .col_20_40_40 > .col:first-child{
      width: 100%;
      display: flex;
      flex-direction: row;
      align-items: center;
      padding: 40px 20px;
      border-bottom:#fff solid 1px;
      border-right:0px;
    }
    footer .col_20_40_40 > .col{ width: 55%;}
    footer .col_20_40_40 > .col:last-child{ width:45%;}
  
    .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;}
    /* footer end here */
  }
  
  @media screen and (min-width: 1280px){
  .pinOverlay {display:none!important;}
  }
  
  
  @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:#fff 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%;}
    /* building code end here */
  
    .floorSlide .slick-arrow.slick-prev{left:20px;}
    .floorSlide .slick-arrow.slick-next{left:80px;}
  }
  
  
  @media screen and (min-width: 0px) and (max-width:900px) {
    /* common css start here */
    .TBspace{padding:40px 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{ padding-bottom:50px;}
    .overviewBlock{ padding-top:60px;}
    .overviewInfo.TBspace{ padding-bottom: 80px;}
  
    /* common css end here */
  
    /* building block start here */
    .floorTotal .col{padding-top: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%;}
    /* 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 */
  
    /* 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:#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 */
  }
  
  /* 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;}
    .scrollText{ display: none;}
    .homeHero::before{ width: 60%; height: 80%;}
  
    .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 .bannerInfo{ margin-right: auto;}
    .homeHero .bannerInfo h1{padding-bottom:10px; 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;}
  
    /* 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;}
    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%;}
  }
  
  @media all and (orientation: portrait) {
    /* main banners start here */
    .scrollText{display:none;}
    .homeHero .scrollText{display:block; bottom:40px;}
    .fullBanner{height:auto;}
    .fullBanner.homeHero{height:100vh;}
  
    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;}
    /* main banners end here */
  
    /* home page start here */
    .overviewImageHolder.TBspace{padding-left:30px; padding-right:30px;}
    .overviewImageHolder .box::before{ padding-top: 54%;}
  
    .overviewBlock{padding-top:0px; padding-bottom: 60vw;}
    .overviewBlock .patternBlock{display: none;}
    .overviewBlock::before{width:100%; height:92%;}
    .overviewImageHolder.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:80vh!important;}
    .homeOne .jarallax .jarallax-img, .ladyimageparallax .jarallax .jarallax-img{object-position:right!important;}
    .homeOne::before, .topcurveAngle{display:block;}
    .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: 44vw; line-height: 40vw; left: -7vw; position: relative;}
    .foodTitle h2{font-size:46vw; line-height: 40vw; left: -6vw; position: relative;}
    .parkInfo{ padding-left:20px; padding-right:20px; font-size:5.8vw; line-height:5.8vw; bottom:4vw;}
    .foodTitle{ padding-bottom: 8%;}
    .foodInfo{padding-left:9vw; padding-right:9vw; font-size:6vw; line-height:6.4vw; bottom:4vw;}
    .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;}
  
    .foodimagesBlock .rightCircle{ height:70%; top:8%; width: 50%;}
  
  
    .foodImagecol.TBspace{ padding-top: 60px;}
    .foodImagecol .imageInfo{width:100%; padding:0 4vw; margin-top:-12vw;}
    .foodImagecol .imageInfo img{ width: 26%!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; align-items: flex-end;}
    .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}
    .artImage{width:70%; padding-bottom:40px;}
    .artImage .imageInfo img{ margin-bottom: 10vw;}
    .artImageHolder{margin-top:0;}
    .artTitle{width:100%; padding-bottom:2%; margin-bottom:-2%;}
  
    .artImage .imageInfo{ width:70vw; top:auto; bottom:10vw; right:-30vw; left:auto; align-items: flex-end;}
    .artTitle h2{font-size:44vw; line-height:30vw; 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;}
    .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%;}
    .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;}
    /* 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; width:170%; height:80%;}
    .workSpaceOne .workSpaceHalfRound{ top:-34%;}
    .workSpaceOne.TBspace, .workSpaceTwo .TBspace{padding-top:60px; padding-bottom:60px;}
    .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%;}
    /* Building page end */
  
    /* flplan popup start here */
  
    /* flplan popup end here */
  
    /* paralax image text start */
    .parallax80 .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{ 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:160px;
    }
  
    body.error404 #page-wrap::before{width:60vw; height:50vw;}
  
    .logowrapper{max-width:70%;}
  
    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%;}
  
    .homeHero .jarallax-img{object-position: 66% 50%!important;}
    .fullBanner.homeHero{ height: 90vh;}
    .homeHero .bannerInfo{ margin-top: -40%;}
    .page-template-template-sustainability .heroBlock .imageHolder img{object-position: left center;}
  }
  
  }
  /* 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: block; bottom: 20px;}
    .fullBanner{height: auto;}
    .fullBanner.homeHero{ height: 100vh;}
  
  
    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::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: 44vw; line-height: 40vw; left: -7vw; position: relative;}
    .foodTitle h2{font-size:46vw; line-height: 40vw; left: -6vw; position: relative;}
    .parkInfo{ padding-left:20px; padding-right:20px; font-size:5.8vw; line-height:5.8vw; bottom:4%;}
    .foodTitle{ padding-bottom: 8%;}
    .foodInfo{padding-left:9vw; padding-right:9vw; font-size:6vw; line-height:6.4vw; bottom:0;}
    .foodInfo br{ display: none;}
    .foodBlock{padding-top:60px;}
    .foodLargeImage .box::before{ padding-top: 70%;}
    .foodTitle{ margin-top: 0;}
  
    .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 .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; align-items: flex-end;}
    .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;}
    .artImage{width:70%; padding-bottom:40px;}
    .artImage .imageInfo img{ margin-bottom: 10vw;}
    .artImageHolder{margin-top:0;}
    .artTitle{width:100%; padding-bottom:2%; margin-bottom:-2%;}
  
    .artImage .imageInfo{ width:70vw; top:auto; bottom:10vw; right:-30vw; left:auto; align-items: flex-end;}
    .artTitle h2{font-size:44vw; line-height:30vw; 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;}
    .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%;}
    .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;}
    /* 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%;}
    .workSpaceOne.TBspace, .workSpaceTwo .TBspace{padding-top:60px; padding-bottom:60px;}
    .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);}
    /* Building page end */
  
    /* paralax image text start */
    .parallax80 .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{ 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{ height:40vh;}
  
    .specBlock .col img{
      /* width:160px; */
      max-height:160px;
    }
  
    body.error404 #page-wrap::before{width:60vw; height:50vw;}
    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;
  }
  
  }
  
  @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 */
   
  
    .imageTextBlock .col{min-height:40vh;}
  
    .localAreaBanner{padding-top:86px;}
    .localAreaBanner .bannerText h1{ font-size:28px; line-height:34px; padding-bottom: 14px; letter-spacing:-1.12px;}
    .localAreaBanner .bannerText a{ font-size: 18px; line-height: 26px; letter-spacing: -0.72px;}
    .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;}
  }
  
  @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)
  {

  
    .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{
      width: 100%;
      display: flex;
      flex-direction: row;
      align-items: center;
      padding: 40px 20px;
      border-bottom:#fff solid 1px;
    }
    footer .col_20_40_40 > .col{ width: 55%;}
    footer .col_20_40_40 > .col:last-child{ width:45%;}
  
    .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:74px;}
    ul.footerLargeMenu li a::before{
    opacity:1;
    width:36px;
    height:28px;
    background-size:36px;
    background-position: center center;
    right:auto;
    left:20px;
  }
    /* footer end here */
  
    body.error404 #page-wrap::before{width:56vw; height:40vw;}
  
    .logowrapper {max-width: 40%;}
    ul.footerLargeMenu li a:hover::after{ right: -100%;}
  }
  
  @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%;}
  }
  
  @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}
  
    .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:20px; line-height: 26px; 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; 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;}
    .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, .floorArea > div 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:640px) {
    .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;}
    .floorTotal .col span, .floorArea > div span{font-size:74px; line-height:70px; letter-spacing: -2.96px;}
    .floorTotal sup, .flTitle{font-size:26px; line-height:30px; letter-spacing: -1.04px;}
    .floorTotal sub{ font-size: 22px; line-height: 26px; 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{ padding-left: 0; padding-right: 0;}
    .overviewBlock{padding-bottom:70vw;}
    .content_820.parallaxImgBox{ width: 100%; top:-70vw;}

  
  }
  
  @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{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 */
    .overviewImageHolder.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{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 */
    .travelStation .col{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;}
    .parkTitle{margin-top:-24vw;}
  
    .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:80%; padding-bottom:20px;}
    .artImage .imageInfo{right:-14vw; bottom:20vw;}
    .artImageHolder .box{transform: scale(1.4);}
    .artImageHolder .box .imageHolder{ top:-40px}
  
    .CLimgTwo .imageInfo, .CLimgThree .imageInfo{margin-top:-22vw;}
    .CLimgTwo .imageInfo img, .CLimgThree .imageInfo img{width:28%;}
    .CLimgTwo .imageInfo span{padding-right:10px;}
    .CLimgThree .imageInfo span{padding-left:10px;}
  
    .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;}
  
    /* 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%;}
    .workSpaceOne.TBspace, .workSpaceTwo .TBspace{padding-top:40px; padding-bottom:40px;}
    .workSpaceTwo::before{height: calc(100% - 25%);}
    .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 */
  
    /* 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;}
    .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;}
  
    .contactInfo h2{padding:0 0 20px 0;}
    footer .col_20_40_40 > .col.contactInfo{ padding-left: 20px; padding-right: 20px;}
    /* footer end here */
  
    body.error404 #page-wrap::before{width:80vw; height:80vw;}
  }
  
  @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) {
    .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) {
  }
  
  @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;}
  }
  