<div class="nav">
<div class="nav__top-bar">
<img class="nav__logo" src="/ytl-logo.png" />
<div class="nav__buttons-container">
<div class="nav__hamburger-button">
<div class="nav__hamburger-open">
<img src="/hamburger.svg" />
Menu
</div>
<div class="nav__hamburger-close">
<img src="/close.svg" />
Close
</div>
</div>
<div class="nav__cta">Contact Us</div>
</div>
</div>
<div class="nav__expandable">
<div class="nav__primary-section">
<div class="nav__primary-container">
<div class="nav__home-button">Home</div>
<div class="nav__primary-item has-children" data-section-id="1">About us</div>
<div class="nav__primary-item has-children"> Our Projects</div>
<div class="nav__primary-item has-children">Work with Us</div>
<div class="nav__primary-item ">News</div>
<div class="nav__search-input">
<img src="/search.svg" />
<input type="text" placeholder="Search">
</div>
</div>
<div class="nav__cta-mobile">Contact Us</div>
</div>
<div class="nav__secondary-section">
<div class="nav__secondary-return"><img src="/left-arrow-white.svg" />
<div>Go Back</div>
<div class="nav__secondary-return-spacer"></div>
</div>
<div class="nav__secondary-container" data-section-id="1" style="display:none">
<div class="nav__secondary-item nav__secondary-title"><a href="/">About Us</a></div>
<div class="nav__secondary-item"><a href="/">Our Story</a></div>
<div class="nav__secondary-item"><a href="/">Our mission, vision & values</a></div>
<div class="nav__secondary-item"><a href="/">Our people</a></div>
<div class="nav__secondary-item"><a href="/">Diversity & inclusion</a></div>
<div class="nav__secondary-item"><a href="/">Our responsibilities (ESG)</a></div>
</div>
</div>
</div>
</div>
<div class="page-content">
<div class="hero-row invert full-image ">
<div class="hero-row__container">
<div class="hero-row__text">
<div class="hero-row__text-container">
<div class="hero-row__subheading heading-5">Welcome to YTL Developments</div>
<div class="hero-row__heading heading-1">
<h1>Award winning property developers</h1>
</div>
<div class="hero-row__copy paragraph">We’re an ambitious, innovative and aspirational company that aims to bring a radical, new approach to development by creating sustainable communities that understand and meet the needs of people.</div>
<div class="flex-row-responsive">
<div class="primary-cta white">
<div class="primary-cta__inner-container">
<div class="primary-cta__arrow-left"></div>
<div class="primary-cta__text">Find out more</div>
</div>
<div class="primary-cta__arrow-right"></div>
</div>
</div>
</div>
</div>
<div class="hero-row__image image-container">
<img src="/placeholder.png" />
<img class="hero-row__logo" src="/ytl-logo-alt.svg" />
</div>
</div>
</div>
<div class="highlight-row ">
<div class="highlight-row__container container-constrained">
<div class="highlight-row__text">
<h4 class="heading-2 highlight-row__heading">Award winning property developers</h4>
<div class="heading-5 highlight-row__subheading">Welcome to YTL Developments</div>
<div class="secondary-cta">
<div class="secondary-cta__text">Find out more</div>
<div class="secondary-cta__arrow"><img src="/right-arrow.svg" /></div>
</div>
</div>
<div class="highlight-row__highlights">
<div class="highlight-row__highlight-wrapper">
<div class="statistic">
<div class="statistic__content">
<div class="heading-1 statistic__data">4</div>
<div class="heading-4 statistic__description">New Developments</div>
</div>
</div>
</div>
<div class="highlight-row__highlight-wrapper">
<div class="statistic">
<div class="statistic__content">
<div class="heading-1 statistic__data">12</div>
<div class="heading-4 statistic__description">Nationwide Awards</div>
</div>
</div>
</div>
<div class="highlight-row__highlight-wrapper">
<div class="statistic">
<div class="statistic__content">
<div class="heading-1 statistic__data">1,200</div>
<div class="heading-4 statistic__description">Local Jobs Created</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="box-cards-row ">
<div class="container-constrained">
<div class="box-cards-row__heading center-text">
<h2 class="heading-2">Award winning property developers</h2>
</div>
<div class="box-cards-row__cards-container ">
<div class="box-cards-row__card-wrapper ">
<div class="card-box ">
<a class="card-box__link cta-parent" href="/">
<div class="card-box__image image-container">
<img src="/placeholder.png" />
</div>
<div class="card-box__content">
<div class="card-box__content-wrapper">
<div>
<div class="card-box__title heading-3">Brabazon</div>
<div class="card-box__description paragraph">Inspired by an icon of engineering, Brabazon is a place that changes everything: a thriving new neighbourhood for Bristol and the most exciting new cit</div>
</div>
<div class="flex-row">
<div class="primary-cta ">
<div class="primary-cta__inner-container">
<div class="primary-cta__arrow-left"></div>
<div class="primary-cta__text">Find out more</div>
</div>
<div class="primary-cta__arrow-right"></div>
</div>
</div>
</div>
</div>
</a>
</div>
</div>
<div class="box-cards-row__card-wrapper ">
<div class="card-box ">
<a class="card-box__link cta-parent" href="/">
<div class="card-box__image image-container">
<img src="/placeholder.png" />
</div>
<div class="card-box__content">
<div class="card-box__content-wrapper">
<div>
<div class="card-box__title heading-3">YTL Arena</div>
<div class="card-box__description paragraph">Inspired by an icon of engineering, Brabazon is a place that changes everything: a thriving new neighbourhood for Bristol and the most exciting new cit</div>
</div>
<div class="flex-row">
<div class="primary-cta ">
<div class="primary-cta__inner-container">
<div class="primary-cta__arrow-left"></div>
<div class="primary-cta__text">Find out more</div>
</div>
<div class="primary-cta__arrow-right"></div>
</div>
</div>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="banner-row ">
<div class="banner-row__container">
<div class="banner-row__underlay"></div>
<div class="banner-row__text">
<div class="banner-row__text-container">
<div class="banner-row__subheading heading-5">Welcome to YTL Developments</div>
<div class="banner-row__heading heading-1">
<h1>Award winning property developers</h1>
</div>
<div class="banner-row__copy paragraph">We’re an ambitious, innovative and aspirational company that aims to bring a radical, new approach to development by creating sustainable communities that understand and meet the needs of people.</div>
<div class="banner-row__cta-container">
<div class="primary-cta ">
<div class="primary-cta__inner-container">
<div class="primary-cta__arrow-left"></div>
<div class="primary-cta__text">Find out more</div>
</div>
<div class="primary-cta__arrow-right"></div>
</div>
</div>
</div>
</div>
<div class="banner-row__image image-container">
<img src="/placeholder.png" />
</div>
</div>
</div>
<div class="text-image-row two-thirds invert">
<div class="container-constrained text-image-row__container">
<div class="text-image-row__image image-container">
<img src="/placeholder.png" />
</div>
<div class="text-image-row__text">
<div class="text-image-row__text-container">
<div class="text-image-row__title heading-2">About Us</div>
<div class="text-image-row__copy paragraph">We’re an ambitious, innovative and aspirational company that aims to bring a radical, new approach to development by creating sustainable communities that understand and meet the needs of people.</div>
<div class="secondary-cta">
<div class="secondary-cta__text">Find out more</div>
<div class="secondary-cta__arrow"><img src="/right-arrow.svg" /></div>
</div>
<div class="secondary-cta">
<div class="secondary-cta__text">Find out more</div>
<div class="secondary-cta__arrow"><img src="/right-arrow.svg" /></div>
</div>
</div>
</div>
</div>
</div>
<div class="full-cards-row inverse">
<div class="container-constrained">
<div class="full-cards-row__heading center-text">
<h2 class="heading-2">About Us</h2>
</div>
<div class="full-cards-row__cards-container ">
<div class="full-cards-row__card-wrapper ">
<div class="full-card">
<a href="/">
<div class="full-card__image image-container">
<img src="/placeholder.png" />
</div>
<div class="full-card__content">
<div class="full-card__content-wrapper">
<div class="full-card__title heading-3">Why join us</div>
<img src="/right-arrow-white.svg" />
</div>
</div>
</a>
</div>
</div>
<div class="full-cards-row__card-wrapper ">
<div class="full-card">
<a href="/">
<div class="full-card__image image-container">
<img src="/placeholder.png" />
</div>
<div class="full-card__content">
<div class="full-card__content-wrapper">
<div class="full-card__title heading-3">Open Vacancies</div>
<img src="/right-arrow-white.svg" />
</div>
</div>
</a>
</div>
</div>
<div class="full-cards-row__card-wrapper ">
<div class="full-card">
<a href="/">
<div class="full-card__image image-container">
<img src="/placeholder.png" />
</div>
<div class="full-card__content">
<div class="full-card__content-wrapper">
<div class="full-card__title heading-3">Early Careers</div>
<img src="/right-arrow-white.svg" />
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="logo-row scroller ">
<div class="container-constrained-small logo-row__container">
<div class="logo-row__heading heading-3">
Our Awards
</div>
<div class="logo-scroller">
<img src="/placeholder.png" data-index="0" />
<img src="/placeholder-2.png" data-index="1" />
<img src="/placeholder-3.png" data-index="2" />
<img src="/placeholder-4.png" data-index="3" />
<img src="/placeholder.png" data-index="0" />
<img src="/placeholder-2.png" data-index="1" />
<img src="/placeholder-3.png" data-index="2" />
<img src="/placeholder-4.png" data-index="3" />
<img src="/placeholder.png" data-index="0" />
<img src="/placeholder-2.png" data-index="1" />
<img src="/placeholder-3.png" data-index="2" />
<img src="/placeholder-4.png" data-index="3" />
<img src="/placeholder-2.png" data-index="0" />
<img src="/placeholder.png" data-index="1" />
</div>
<div class="logo-scroller-mobile">
<div class="logo-scroller-mobile__slide">
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder.png" title="test title 1" data-index="0" />
</div>
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder-2.png" title="test title 2" data-index="1" />
</div>
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder-3.png" title="test title 3" data-index="2" />
</div>
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder-4.png" title="test title 1" data-index="3" />
</div>
</div>
<div class="logo-scroller-mobile__slide">
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder.png" title="test title 1" data-index="0" />
</div>
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder-2.png" title="test title 2" data-index="1" />
</div>
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder-3.png" title="test title 3" data-index="2" />
</div>
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder-4.png" title="test title 1" data-index="3" />
</div>
</div>
<div class="logo-scroller-mobile__slide">
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder.png" title="test title 1" data-index="0" />
</div>
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder-2.png" title="test title 2" data-index="1" />
</div>
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder-3.png" title="test title 3" data-index="2" />
</div>
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder-4.png" title="test title 1" data-index="3" />
</div>
</div>
<div class="logo-scroller-mobile__slide">
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder-2.png" title="test title 2" data-index="0" />
</div>
<div class="logo-scroller-mobile__slide-container">
<img src="/placeholder.png" title="test title 3" data-index="1" />
</div>
</div>
</div>
<div class="logo-grid">
<div class="logo-grid__wrapper">
<img src="/placeholder.png" data-index="0" />
</div>
<div class="logo-grid__wrapper">
<img src="/placeholder-2.png" data-index="1" />
</div>
<div class="logo-grid__wrapper">
<img src="/placeholder-3.png" data-index="2" />
</div>
<div class="logo-grid__wrapper">
<img src="/placeholder-4.png" data-index="3" />
</div>
<div class="logo-grid__wrapper">
<img src="/placeholder.png" data-index="0" />
</div>
<div class="logo-grid__wrapper">
<img src="/placeholder-2.png" data-index="1" />
</div>
<div class="logo-grid__wrapper">
<img src="/placeholder-3.png" data-index="2" />
</div>
<div class="logo-grid__wrapper">
<img src="/placeholder-4.png" data-index="3" />
</div>
<div class="logo-grid__wrapper">
<img src="/placeholder.png" data-index="0" />
</div>
<div class="logo-grid__wrapper">
<img src="/placeholder-2.png" data-index="1" />
</div>
<div class="logo-grid__wrapper">
<img src="/placeholder-3.png" data-index="2" />
</div>
<div class="logo-grid__wrapper">
<img src="/placeholder-4.png" data-index="3" />
</div>
<div class="logo-grid__wrapper">
<img src="/placeholder-2.png" data-index="0" />
</div>
<div class="logo-grid__wrapper">
<img src="/placeholder.png" data-index="1" />
</div>
</div>
<div class="flex-row logo-row__cta-container">
<div class="tertiary-cta">
<div class="tertiary-cta__text">Find out more</div>
<div class="tertiary-cta__arrow"><img src="/right-arrow.svg" /></div>
</div>
</div>
</div>
</div>
<div class="text-image-row full-image two-thirds">
<div class="container-constrained text-image-row__container">
<div class="text-image-row__image image-container">
<img src="/placeholder.png" />
</div>
<div class="text-image-row__text">
<div class="text-image-row__text-container">
<div class="text-image-row__title heading-2">About Us</div>
<div class="text-image-row__copy paragraph">We’re an ambitious, innovative and aspirational company that aims to bring a radical, new approach to development by creating sustainable communities that understand and meet the needs of people.</div>
<div class="secondary-cta">
<div class="secondary-cta__text">Find out more</div>
<div class="secondary-cta__arrow"><img src="/right-arrow.svg" /></div>
</div>
<div class="secondary-cta">
<div class="secondary-cta__text">Find out more</div>
<div class="secondary-cta__arrow"><img src="/right-arrow.svg" /></div>
</div>
</div>
</div>
</div>
</div>
<div class="footer">
<div class="footer__container container-constrained">
<div class="footer__container-top">
<div class="footer__top-logo">
<img src="/ytl-logo.png" />
</div>
<div class="footer__primary">
</div>
</div>
<div class="footer__container-bottom">
</div>
</div>
</div>
</div>
{{!< layouts}}
{{> @nav }}
<div class="page-content">
{{> @hero-row invert=true fullImage=true}}
{{> @highlight-row }}
{{> @box-cards-row cards=boxCards title=heading}}
{{> @banner-row }}
{{> @text-and-image-row theme=" two-thirds invert" }}
{{> @full-cards-row cards=fullCards inverse=true}}
{{> @logo-row images=images scroller=true}}
{{> @text-and-image-row theme=" full-image two-thirds"}}
{{> @footer }}
</div>
{
"title": "About Us",
"subheading": "Welcome to YTL Developments",
"heading": "Award winning property developers",
"copy": "We’re an ambitious, innovative and aspirational company that aims to bring a radical, new approach to development by creating sustainable communities that understand and meet the needs of people.",
"highlights": [
{
"data": "4",
"description": "New Developments"
},
{
"data": "12",
"description": "Nationwide Awards"
},
{
"data": "1,200",
"description": "Local Jobs Created"
}
],
"fullCards": [
{
"title": "Why join us"
},
{
"title": "Open Vacancies"
},
{
"title": "Early Careers"
}
],
"boxCards": [
{
"title": "Brabazon",
"description": "Inspired by an icon of engineering, Brabazon is a place that changes everything: a thriving new neighbourhood for Bristol and the most exciting new cit"
},
{
"title": "YTL Arena",
"description": "Inspired by an icon of engineering, Brabazon is a place that changes everything: a thriving new neighbourhood for Bristol and the most exciting new cit"
}
],
"images": [
[
{
"url": "/placeholder.png",
"title": "test title 1"
},
{
"url": "/placeholder-2.png",
"title": "test title 2"
},
{
"url": "/placeholder-3.png",
"title": "test title 3"
},
{
"url": "/placeholder-4.png",
"title": "test title 1"
}
],
[
{
"url": "/placeholder.png",
"title": "test title 1"
},
{
"url": "/placeholder-2.png",
"title": "test title 2"
},
{
"url": "/placeholder-3.png",
"title": "test title 3"
},
{
"url": "/placeholder-4.png",
"title": "test title 1"
}
],
[
{
"url": "/placeholder.png",
"title": "test title 1"
},
{
"url": "/placeholder-2.png",
"title": "test title 2"
},
{
"url": "/placeholder-3.png",
"title": "test title 3"
},
{
"url": "/placeholder-4.png",
"title": "test title 1"
}
],
[
{
"url": "/placeholder-2.png",
"title": "test title 2"
},
{
"url": "/placeholder.png",
"title": "test title 3"
}
]
]
}
No notes defined.