@font-face{
	font-family: 'BodoniModa';
	src: url('/fonts/Bodoni_Moda_Regular/Bodoni_Moda_Regular.eot');
	src: url('/fonts/Bodoni_Moda_Regular/Bodoni_Moda_Regular.eot') format('embedded-opentype'),
	url('/fonts/Bodoni_Moda_Regular/Bodoni_Moda_Regular.woff') format('woff'),
	url('/fonts/Bodoni_Moda_Regular/Bodoni_Moda_Regular.woff2') format('woff2'),
    url('/fonts/Bodoni_Moda_Regular/Bodoni_Moda_Regular.ttf') format('truetype'),
    url('/fonts/Bodoni_Moda_Regular/Bodoni_Moda_Regular.svg') format('svg');
	font-weight: normal;
    font-style: normal;
}

@font-face{
	font-family: 'PTSerifRegular';
	src: url('/fonts/ptserif/regular/PTSerifRegular.eot');
	src: url('/fonts/ptserif/regular/PTSerifRegular.eot') format('embedded-opentype'),
	url('/fonts/ptserif/regular/PTSerifRegular.woff') format('woff'),
	url('/fonts/ptserif/regular/PTSerifRegular.woff2') format('woff2'),
    url('/fonts/ptserif/regular/PTSerifRegular.ttf') format('truetype'),
    url('/fonts/ptserif/regular/PTSerifRegular.svg') format('svg');
	font-weight: normal;
    font-style: normal;
}
 
@font-face{
	font-family: 'NunitoRegular';
	src: url('/fonts/nunito/Nunito-Regular.eot');
	src: url('/fonts/nunito/Nunito-Regular.eot') format('embedded-opentype'),
	url('/fonts/nunito/Nunito-Regular.woff') format('woff'),
	url('/fonts/nunito/Nunito-Regular.woff2') format('woff2'),
    url('/fonts/nunito/Nunito-Regular.ttf') format('truetype'),
    url('/fonts/nunito/Nunito-Regular.svg') format('svg');
	font-weight: normal;
    font-style: normal;
}

*{
	padding: 0;
	margin: 0;
	text-decoration: none;
    box-sizing: border-box;
}
html{
	overflow-x:hidden;
}
:root{
	/* Typography scale */
	--fs-body:20px;
	--fs-body-sm:18px;
	--fs-small:16px;
	--fs-h1:52px;
	--fs-h2:38px;
	--fs-h3:28px;
	--fs-h4:24px;
	--fs-h5:22px;
	--fs-h6:20px;
	--fs-titlebar:44px;
	--fs-button:18px;
	--lh-body:1.6;
	--lh-heading:1.2;
	--lh-small:1.5;
	/* Back-compat aliases used by the additional-page stylesheet */
	--h1:var(--fs-h1);
	--h2:var(--fs-h2);
	--h3:var(--fs-h3);
	--h4:var(--fs-h4);
	--h5:var(--fs-h5);
	--h6:var(--fs-h6);
	--body:var(--fs-body);
	/* Spacing scale */
	--space-1:4px;
	--space-2:8px;
	--space-3:12px;
	--space-4:16px;
	--space-5:24px;
	--space-6:32px;
	--space-7:40px;
	--space-8:56px;
	--paragraph-gap:14px;
	--list-gap:6px;
	--heading-gap:12px;
	--section-pad:44px;
	--section-gap:24px;
	--grid-gap:24px;
	--card-pad:24px;
	--container-max:1240px;
	--container-pad:20px;
	--header-height:100px;
}
@media (max-width:992px){
	:root{
		--fs-h1:42px;
		--fs-h2:32px;
		--fs-h3:25px;
		--fs-h4:22px;
		--fs-h5:20px;
		--fs-h6:19px;
		--fs-titlebar:36px;
		--section-pad:34px;
		--section-gap:20px;
		--grid-gap:20px;
		--card-pad:22px;
	}
}
@media (max-width:576px){
	:root{
		--fs-body:18px;
		--fs-small:15px;
		--fs-h1:34px;
		--fs-h2:28px;
		--fs-h3:23px;
		--fs-h4:20px;
		--fs-h5:19px;
		--fs-h6:18px;
		--fs-titlebar:30px;
		--fs-button:17px;
		--section-pad:26px;
		--section-gap:16px;
		--grid-gap:16px;
		--card-pad:20px;
	}
}
body{
    background-color:#fff;
    color: var(--font);
    overflow-x:hidden;
    font-family:var(--reg);
    font-size:var(--fs-body);
    line-height:var(--lh-body);
}
p {
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    margin: 0 0 var(--paragraph-gap);
}
li {
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    margin: 0 0 var(--list-gap);
}
p + ul, p + ol, ul + p, ol + p {
    margin-top: var(--paragraph-gap);
}
picture, img {
    width: 100%;
    max-width: 100%;
    display: table;
}
a{
	display: inline-block;
    line-height: inherit;
    color:inherit;
    font-size: inherit;
}
h1,h2,h3,h4,h5,h6,b{
	font-family: var(--bold);
}
ul{
	padding:0;
	margin:0;
	list-style:none;
}
small{
	font-size:var(--fs-small);
	line-height:var(--lh-small);
}
input, select, textarea{
	font-size:var(--fs-body-sm);
	line-height:1.5;
}
.common_button{
	font-size:var(--fs-body-sm);
	line-height:1.5;
}
header {
    position: fixed;
    width: 100%;
    padding: 10px 0;
    z-index: 9;
    transition: all 250ms ease;
    background-color: var(--main-color);
}
body.hpr-property-page header{
    background-color: transparent;
}
body.hpr-property-page header.sticky{
    background-color: var(--main-color);
    box-shadow: var(--box-shadow);
}
body.hpr-property-page .detail_page_wrapper.hastings_prop_page{
    margin-top: 0;
}
div.default_container{
	width:100%;
	max-width:var(--container-max);
	padding:0 var(--container-pad);
	margin:0 auto;
}
div.max_container{
	width:100%;
	max-width:1640px;
	padding:0 var(--container-pad);
	margin:0 auto;
}
section {
    padding: var(--section-pad) 0;
}


h1, h2, h3, h4, h5, h6{
    line-height: var(--lh-heading);
    margin: 0 0 var(--heading-gap);
}
h1 {
    color: var(--white);
}
h1 span{
 	color:var(--secondary-color);
 }
h2.title_center {
    color: var(--main-color);
    text-align: center;
}
* + h1, * + h2, * + h3{
	margin-top:var(--space-5);
}
* + h4, * + h5, * + h6{
	margin-top:var(--space-4);
}
h1, .h1_title {font-size: var(--fs-h1);}
h2, .h2_title {font-size: var(--fs-h2);}
h3, .h3_title {font-size: var(--fs-h3);}
h4, .h4_title {font-size: var(--fs-h4);}
h5, .h5_title {font-size: var(--fs-h5);}
h6, .h6_title {font-size: var(--fs-h6);}
b, optgroup, strong {
    font-family: var(--bold);
}
strike {
    text-decoration: line-through;
}
/* Slick controls - one shared look for every slider on the site. Slick draws
   its own arrow buttons and dot list, so these rules restyle that markup to
   match the control row the testimonials used to hand-build: 28px circular
   outline arrows and 10x4 pill dots that widen and take the brand colour
   when active. Per-section positioning is further down this file. */
.slick-prev,
.slick-next {
    position: absolute;
    top: 50%;
    z-index: 5;
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    padding: 0;
    transform: translate(0, -50%);
    background-color: transparent;
    border: 1px solid var(--secondary-color);
    border-radius: 50%;
    transition: var(--ease);
}
.slick-prev { left: 15px; }
.slick-next { right: 15px; }
.slick-prev:before, .slick-next:before {
    font-family: 'FontAwesome';
    font-size: 16px;
    line-height: 1;
    color: var(--main-color);
    opacity: 1;
    position: relative;
    top: 2px;
}
.slick-prev:before { content: '\f104'; }
.slick-next:before { content: '\f105'; }
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
    background-color: var(--main-color);
    border-color: var(--main-color);
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before { color: #fff; }
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before { opacity: .35; }

.slick-dots {
    position: absolute;
    bottom: -30px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
}
.slick-dots li {
    width: auto;
    height: auto;
    margin: 0;
}
.slick-dots li button {
    display: block;
    width: 10px;
    height: 4px;
    padding: 0;
    background-color: rgba(0,0,0,0.2);
    border: 0;
    border-radius: 2px;
    opacity: 1;
    transition: var(--ease);
}
/* The glyph slick-theme draws inside each dot is redundant now that the
   button itself is the dot. */
.slick-dots li button:before { display: none !important; }
.slick-dots li.slick-active button {
    width: 18px;
    background-color: var(--main-color);
}
.slick-slide:focus{
	outline:0 !important;
}
/* The blog and featured sliders append their arrows and dots into the shared
   controls row instead of laying them over the cards. The blog section is
   white, so its controls use the base treatment unchanged. The featured row
   sits on the brand-coloured band, so its arrows go transparent with a white
   outline and chevron, inverting to a white fill on hover, and its dots go
   white. */
.featured_prop_sec .hastings_slider_controls .slick-prev,
.featured_prop_sec .hastings_slider_controls .slick-next {
    border-color: #fff;
}
.featured_prop_sec .hastings_slider_controls .slick-prev:before,
.featured_prop_sec .hastings_slider_controls .slick-next:before {
    color: #fff;
}
.featured_prop_sec .hastings_slider_controls .slick-prev:hover,
.featured_prop_sec .hastings_slider_controls .slick-next:hover {
    background-color: #fff;
    border-color: #fff;
}
.featured_prop_sec .hastings_slider_controls .slick-prev:hover:before,
.featured_prop_sec .hastings_slider_controls .slick-next:hover:before {
    color: var(--main-color);
}
.featured_prop_sec .slick-dots li button { background-color: rgba(255,255,255,0.4); }
.featured_prop_sec .slick-dots li.slick-active button { background-color: #fff; }
.a_link {
    font-size: 16px;
    color: var(--white);
    background-color: var(--main-color);
    padding: 10px 30px;
    border-radius: 50px;
    border: 2px solid var(--main-color);
    transition:var(--ease);
    cursor:pointer;
}
.a_link:hover{
    background-color: var(--white);
    color: var(--main-color);
}
a:focus-visible, a:focus {
    outline: 0;
}
.banner_sec {
    width: 100%;
    margin: var(--margin) 0 0 0;
    padding: 25px 0 0;
}
.banner_image {
    padding: 80px 20px;
    border-radius: 20px;
    background-blend-mode: multiply;
    background-color: rgba(0, 0, 0, 0.2);
    display: flex;
    justify-content: center;
    align-items: center;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
}
.banner_title {
    font-size: 38px;
    line-height: 1.3;
    color: var(--white);
    text-align: center;
    text-wrap: balance;
}
.sec_btn {
    font-size: 20px;
    padding: 12px 50px;
    border-radius: 50px;
    font-family: var(--bold);
    display: table;
    margin-top: 22px;
    transition:var(--ease);
    color: var(--main-color);
    background-color: var(--secondary-color);
}
.sec_btn.center {
	margin-left:auto;
	margin-right:auto;
}
.sec_btn:hover {
    background-color: #fff;
}
.t_center {
    text-align: center;
    max-width: 90%;
    margin: 0 auto 15px;
}
 * + h1,  * + h2,  * + h3{
    margin-top:30px;
}
.last_child{
	padding-bottom:0;
	margin-bottom:0;
}
.first_child{
	padding-top:0;
	margin-top:0;
}
.bg_secondary{
	background-color:var(--light-color);
}
.login_button {
    padding: 1px 30px;
    background-color: var(--secondary-color);
    border-radius: 60px;
    color: #fff !important;
}
.login_button:hover{
    background-color: var(--main-color);
}
.login_button .fa-sign-in {
    margin-left: 10px;
    font-size: 18px;
    position: relative;
    top: 1px;
}
.header_flex_menu {
    display: flex;
    align-items: center;
    justify-content: space-between;
    grid-gap: 20px;
}
.header_logo img {
    max-width: 280px;
    min-height: 80px;
    object-fit: contain;
}
.flex_menu {
    display: flex;
    align-items: center;
    grid-gap: 30px;
}
.flex_menu > li > .top_padding{
    position: absolute;
    width: 100%;
    height: auto;
    left: -14px;
    top: 60px;
    opacity: 0;
    transition: all 350ms ease;
    pointer-events: none;
    min-width: 260px;
    /*background-color: #01193e;*/
    /* overflow: hidden; */
	padding-top:25px;
}
.flex_menu > li > .top_padding ul{
	background-color: #01193e;
    border-radius: 5px;
    overflow:hidden;
}
.flex_menu > li > ul:before{
	content:'';
	height:100px;
	width:20px;
}
.drop_arrow {
    position: relative;
}

.user  .child_level1 {
    position: absolute;
    width: 100%;
    height: auto;
    right: 0;
    top: 60px;
    opacity: 0;
    transition: all 350ms ease;
    pointer-events: none;
    min-width: 180px;
    /* background-color: #01193e; */
    /* overflow: hidden; */
    padding-top: 25px;
}
.user:hover .child_level1{
    pointer-events: auto;
    opacity: 1;
    top: 44px;
    padding-top: 15px;
}
username {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    width: 100%;
    max-width: 160px;
    font-family: var(--bold);
}
.user li {
	margin:0;
}
.user .child_level1 li:first-child{
	border-radius:5px 5px 0 0;
	overflow:hidden;
}
.user .child_level1 li:last-child{
	border-radius: 0 0 5px 5px;
	overflow:hidden;
}
.user .child_level1 li a{
    padding: 10px 15px;
    background: var(--main-color);
    width: 100%;
    color: #fff;
    transition:var(--ease);
}
.user .child_level1 li a:hover {
    background: #333;
}
.loggin_name {
    display: flex;
    align-items: center;
    grid-gap: 12px;
    cursor: pointer;
    padding: 10px;
    background-color: var(--main-color);
    border-radius: 5px;
    color:var(--white) !important;
}
.loggin_name .gnbicon-user{
    font-size: 32px;
    line-height: 1;
    position: relative;
    top: 2px;
}
.loggin_name .gnbicon-dropdown{
    font-size: 12px;
    line-height: 1;
    position: relative;
    top: 2px;
}

header .drop_arrow:hover > .top_padding{
    pointer-events: auto;
    opacity: 1;
    top: 41px;
    padding-top:15px;
}
.drop_arrow ul li a{
    padding: 10px 15px ;
    background: var(--main-color);
    width: 100%;
    color:#fff;
}
.drop_arrow ul li a:hover{
    background: var(--secondary-color);
}
.drop_arrow ul li a.sub_link {
    position: relative;
    padding-left: 30px;
}
.drop_arrow ul li a.sub_link:before {
    content: '';
    height: 1px;
    width: 8px;
    background-color: #fff;
    position: absolute;
    left: 15px;
    top: 22px;
}
.drop_arrow > ul li:first-child a{
	border-radius:5px 5px 0 0;
}
.drop_arrow > ul li:last-child a{
	border-radius: 0 0 5px 5px;
}
.header_flex_menu > *, footer > *{
    font-family: var(--reg) !important;
}
.flex_menu > li a {
    padding-top: 10px;
    padding-bottom: 10px;
    color: var(--white);
    font-family:var(--reg);
    font-size:18px;
    transition:var(--ease);
}
.flex_menu > li > a:hover{
	color:var(--secondary-color);
}
.flex_menu > li {
	margin:0;
}
.drop_arrow ul li{
  width: 100%;
  margin:0;
}


.one .head {
  text-align: center;
  text-transform: capitalize;
  padding-bottom: 5px;
  position:relative;
  margin-bottom:30px;
  color:var(--main-color);
}
.one .head span{
	color:var(--secondary-color);
}
.one .head:before {
  width: 28px;
  height: 5px;
  display: block;
  content: "";
  position: absolute;
  bottom: 3px;
  left: 50%;
  margin-left: -14px;
  background-color: var(--main-color);
}
.one .head:after {
  width: 100px;
  height: 1px;
  display: block;
  content: "";
  position: relative;
  margin-top: 25px;
  left: 50%;
  margin-left: -50px;
  background-color: var(--main-color);
}

/* drop down arrow css */
.link_arrow {
    position:relative !important;
    padding-right:15px !important;
}
.link_arrow:after {
    content: '';
    position: absolute;
    top: 19px;
    right: 0;
    border: solid var(--white);
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 3px;
    transform: rotate(45deg);
    transition: all 500ms ease;
}
.link_arrow:hover:after {
    animation:250ms indicate ease ;
}
@keyframes indicate {
    0% { top:19px; }
    65%  { top:21px; }
    100%   { top:19px; }    
}
/* end */

.cta_card {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 12px 30px;
    background-color: var(--main-color);
    color: #fff;
    font-family: var(--reg);
    transition: var(--ease);
    text-decoration: none;
    border-radius: 10px;
    font-size: 16px;
    border: 2px solid #dac2dc;
}
a.cta_card:hover {
    transform: scale(0.92);
    border-color: var(--secondary-color);
}

/* line clamp */
.line_clamp_1{
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow : hidden;
}
.line_clamp_2{
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow : hidden;
}
.line_clamp_3{
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow : hidden;
}
.line_clamp_4{
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow : hidden;
}
.line_clamp_5{
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow : hidden;
}
/*end*/

/*home page code here*/
.hero_section{
    position: relative;
}
.bg_img_home_banner{
	/*background-image:url('https://cdn1.gnbproperty.com/gnb-user-uploads/cnb/website/prhi/ca21034da92205b6e45020ef3a09f420.jpg');*/
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	width:100%;
	height: 100vh;
	display:table;
}
.home_page_slider {
    position: absolute;
    height: 100%;
    width: 100%;
    overflow: hidden;
    top: 0;
    display: flex;
    flex-direction: column;
    justify-content: end;
    max-width: 700px;
}
home_page_banner {
    width: 100%;
    min-height:580px;
    height: calc(100vh - var(--margin));
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    display: block;
    margin-top: var(--margin);
}
.home_page_overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    /*background: linear-gradient(0deg, #00000059, transparent);*/
}

.hero_content {
    height: calc(100vh - var(--margin));
    display: grid;
    place-content: center;
    width: 100%;
    margin-top: var(--margin);
    background-color: #0d2b3ff0;
    padding: 50px 90px;
    max-width:680px;
    min-height:580px;
}
.drop_button > a {
    padding: 10px 30px;
}
	
.drop_button {
    background-color: var(--white);
    border-radius: 60px;
    color: var(--main-color);
    font-family: var(--bold);
    font-size: 16px;
    position: relative;
}
.drop_button.arrow > a{
    padding: 10px 45px 10px 30px;
}
.drop_button.arrow:after {
    content: '\f0dd';
    font-family: FontAwesome;
    position: absolute;
    right: 15px;
    top: 0px;
    font-size: 24px;
}
.drop_button .drop_menu {
    /*background: #fff;*/
    border-radius: 20px;
    display: table;
    color: var(--main-color);
    font-family: var(--bold);
    transition:all 250ms ease;
    width: 100%;
    overflow:hidden;
}

.drop_button .padding_top {
    position: absolute;
    left: 0;
    width: 100%;
    display: none;
    z-index:1;
}

.drop_button:hover .padding_top {
	padding-top:5px;
    display: block;
}

.drop_menu a {
    width: 100%;
    display: table;
    color: var(--main-color);
    padding: 8px 30px;
    font-size: 16px;
    background-color: #fff;
}
.drop_menu a:hover {
    background-color: var(--secondary-color);
    color: #fff;
}

.flex_buttons {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 20px;
    margin-top: 50px;
}

.grid_four .card_four{
    padding: 10px;
    text-align: center;
    border-radius: 5px;
    background-color: var(--main-color);
    min-width: 230px;
    min-height: 200px;
    transition:var(--ease);
    box-shadow: none;
    display: grid;
    color:var(--white);
    place-content: center;
    outline: 1px dashed #ffffff63;
    outline-offset: -10px;
}
.grid_four .card_four i{
	transition:var(--ease);
}
.grid_four .card_four:hover i{
	color:var(--secondary-color);
}
.grid_four .card_four:hover{
	outline-color:var(--secondary-color);
}
.grid_four .card_four > .icon {
    font-size: 60px;
    color: inherit;
    line-height: 1;
}
.grid_four .card_four p {
    font-size: 20px;
    margin: 10px 0 0 0;
    font-family: var(--bold);
    color: inherit;
}
.grid_four {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 40px;
}
.flex_button_container {
    display: flex;
    align-items: center;
    grid-gap: 20px;
    justify-content: center;
    margin-top: 40px;
    flex-wrap:wrap;
}
.about_us_container picture img {
    max-height: 470px;
    object-fit: cover;
    object-position: bottom;
}
.about_us_container picture {
    margin-top: 50px;
    border-radius: 15px;
    overflow: hidden;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.grid_list_container {
    display: grid;
    grid-template-columns: 0.8fr 1fr;
    grid-gap: 50px;
    margin-top: 40px;
}
.grid_list_sec picture {
	height:100%;
    width: 100%;
}
.grid_list_sec picture img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    max-height:524px;
}
.grid_list_sec li {
    padding: 18px 30px;
    background-color: var(--main-color);
    color: #fff;
    font-size: 20px;
}
.grid_list_sec li:before {
    content: '\f069';
    font-family: fontawesome;
    font-size: 15px;
    margin-right: 15px;
}
.banner_like_container {
    background-color: var(--dark-color);
    background-blend-mode: multiply;
    background-size: cover;
    background-position: center;
    padding: 50px 20px;
    color: #fff;
}

    .quick_access_img {
    	width:100%;
    	margin-bottom:0;
    	height:300px;
    }
    .quick_access_img.first-sec {
        background: linear-gradient(90deg, rgba(25, 19, 19, 0.5), rgba(71, 71, 71, 0.3)), url('https://cdn1.gnbproperty.com/gnb-user-uploads/cnb/website/woodleys/63ca39f637ab2caf7fe320a9c13180f0.jpg');
        background-size: cover;
        background-position: center;
    }
    .quick_access_img.third-sec {
        background: linear-gradient(90deg, rgba(25, 19, 19, 0.5), rgba(71, 71, 71, 0.3)), url('https://cdn1.gnbproperty.com/gnb-user-uploads/cnb/website/woodleys/f4292a6225d0e697c0da4047d8e34863.jpg');
        background-size: cover;
        background-position:bottom;
    }
    .quick_access_img.five-sec {
        background: linear-gradient(90deg, rgba(25, 19, 19, 0.5), rgba(71, 71, 71, 0.3)), url('https://cdn1.gnbproperty.com/gnb-user-uploads/cnb/website/woodleys/f4292a6225d0e697c0da4047d8e34863.jpg');
        background-size: cover;
        background-position: center;
    }
    .quick_access_img.second-sec {
        background: var(--secondary-color);
        background-size: cover;
        background-position: right;
    }
    .quick_access_img.second-sec h2{
    	color:#fff;
    }

    figure.effect-layla figcaption::after, figure.effect-layla h2, figure.effect-layla p {
	    -webkit-transition-delay: 0.15s;
	    transition-delay: 0.15s;
	}
	figure.effect-layla h2, figure.effect-layla p {
	    opacity: 1;
	    font-weight:300;
	    -webkit-transform: translate3d(0,0,0);
	    transform: translate3d(0,0,0);
	    transition:all 200ms ease;
	}
	.quick_access_img:hover figure.effect-layla p{
		margin-top:5px;
	}
	figure.effect-layla figcaption::before, figure.effect-layla figcaption::after {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
		transition:all 250ms ease;
	}
	figure.effect-layla h2 {
	    padding-top: 120px;
	    transition: all 250ms ease;
	    margin: 0 auto;
	    max-width: 340px;
	    font-size: 28px;
	    line-height: 1.3;
	    font-weight:500;
	}
	.quick_access_img:hover figure.effect-layla h2{
		padding-top:130px;
	}
	.quick_access_img:hover figure.effect-layla figcaption::after {
	    border-right: 1px solid rgb(255 255 255 / 35%);
	    border-left: 1px solid rgb(255 255 255 / 35%);
	}
	.quick_access_img:hover figure.effect-layla figcaption::before {
	    border-top: 1px solid rgb(255 255 255 / 35%);
	    border-bottom: 1px solid rgb(255 255 255 / 35%);
	}
	.grid_cards {
	    display: grid;
	    grid-template-columns: repeat(4, 1fr);
	    grid-gap: 20px;
	}
	.grid_cards a {
	    padding: 16px;
	    border-radius: 20px;
	    box-shadow: none;
	    transition: all 280ms ease;
	    background-color:var(--light-color);
	}
	.grid_cards a:hover {
	    box-shadow:var(--box-shadow);
	}
	.grid_cards a:hover h2:after {
		background-color: var(--secondary-color);
	}
	.grid_cards a img {
	    width: 100%;
	    border-radius: 10px;
	    max-height: 200px;
	    object-fit: cover;
	    height: 100%;
	    display: grid;
	    min-height: 200px;
	}
	.grid_card h2 {
	    font-size: 24px;
	    position:relative;
	    margin: 30px 0 15px;
	}
	.grid_card h2:after {
	    position: absolute;
	    top: -65px;
	    right: 20px;
	    font-family: "gnb-font" !important;
	    padding: 18px;
		background-color:var(--main-color);
	    font-size: 32px;
	    border-radius: 80px;
	    color: #fff;
	    transition: all 250ms ease;
	    line-height:1;
	    height: 72px;
	    width: 72px;
	}
	.grid_cards a:hover h2:after{
	    background-color: var(--secondary-color);
	}
	.grid_cards a:nth-child(1) .grid_card h2:after {
	    content: "\71";
	}
	.grid_cards a:nth-child(2) .grid_card h2:after {
	    content: "\33";
	}
	.grid_cards a:nth-child(3) .grid_card h2:after {
	    content: "\e0ed";
	}
	.grid_cards a:nth-child(4) .grid_card h2:after {
	    content: "\e0f1";
	}
	.grid_card p {
	    font-size: 15px;
	    line-height: 1.5;
	}
	.as_container.asset .col_50{
		width:100%;
		border-radius: 20px;
		overflow: hidden;
		
	}
	.feature_sec .sub_head, .about_us_sec .sub_head {
		text-align:left;
	}
	.quick_access .as_container{
		max-width:1600px;
	}
	.text_link {
	    position: relative;
	    display: table;
	    padding-right: 25px;
	    text-underline-offset: 5px;
	    color:#888;
	    transition:all 250ms ease;
	}
	
	.text_link:after {
	    content: '->';
	    position: absolute;
	    right: 5px;
	    top: 3px;
	    color: inherit;
	    transition: right 280ms ease;
	    font-size: 17px;
	    line-height: 1;
	    font-family: monospace;
	    letter-spacing: -2.5px;
	    opacity:0;
	}
	.text_link:hover:after {
	    right:0;
	    opacity:1;
	}
	.text_link:hover {
	    color: var(--secondary-color);
	}
	@media (max-width:1445px){
		.grid_cards{
			grid-template-columns: repeat(2, 1fr);
			max-width: 992px;
			margin: 0 auto;
		}
		.grid_cards a img {
		    max-height: 280px;
		    min-height: 280px;
		}
	}
	@media (max-width:1200px){
		
		.quick_access .sub_head{
			text-align:center;
		}
		h1 {
		    font-size: var(--fs-h1);
		}
	}
	@media (max-width:992px){
		.as_container.asset {
		    grid-gap: 40px;
		    max-width: 600px;
		    margin: 0 auto;
		}
		.grid_cards{
		    grid-template-columns: auto;
		    max-width: 590px;
	}
	}
	@media (max-width:480px){
		.quick_access_img figure.effect-layla figcaption{
			border:0;
		}
		figure.effect-layla figcaption::before, figure.effect-layla figcaption::after{
			content:none;
		}
		figure.effect-layla h2 {
		    font-size: 22px;
		}
	}

/*footer*/
footer p b{
	font-size:22px;
}
footer p, footer a{
	color:#000;
	font-size:18px;
}
footer p > a:hover{
	color:var(--main-color);
}
footer {
    background-color: var(--dark-color);
    padding:0;
}
.footer_grid_container {
    padding: 100px 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 100px;
}
.widget_social {
    display: flex;
    flex-wrap: wrap;
}
.widget_social a {
    width: 45px;
    height: 45px;
    color: #fff;
    font-size: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 5px;
    transition: 0.3s;
    border-radius: 3px;
    background-color:var(--main-color);
    border: 1px solid #ffffff3d;
}
.widget_social a:hover {
    background: #979593;
}
.flex_copyrights {
    display: flex;
    align-items: center;
    justify-content: space-between;
    grid-gap: 20px;
}
.footer_flex_link {
    display: flex;
    align-items: center;
    grid-gap: 20px;
}
.copyrights_sec {
    padding: 35px 0;
    background-color: var(--main-color);
}
.copyrights_sec p, .copyrights_sec a{
	font-size:16px;
	color:#fff;
}
.error {
    border: 1px solid #ffaaaa !important;
    background: #fff7f7;
}

/*color*/
.ff_body{
    font-family: var(--body)
}
.ff_title{
    font-family: var(--title)
}
.fmc{
	color:var(--main-color);
}
.fsc{
	color:var(--secondary-color);
}
.fgc{
	color:#888;
}
.flc{
	color:var(--light-color);
}
.fdc{
	color:var(--dark-color);
}
.dim_text{
	color:#ffffff8c;
}
.bgmc{
	background-color:var(--main-color);
}
.bgsc{
	background-color:var(--secondary-color);
}
.bglc{
	background-color:var(--light-color);
    color:var(--dark-color)
}
.bgdc{
	background-color:var(--dark);
}
.bg_fa{
	background-color: #fafafa;
}
.bg_f5{
	background-color: #f5f5f5;
}

.bg_cover {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.bg_contain {
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

/*privacy policy privacy_policy*/
.gnb-overall-privacy-policy{
    padding:80px 0 30px; 
}
.gnb-privacy-p-b-10 p, .gnb-privacy-p-b-50 p{
    font-size: 16px !important;
    margin-bottom: 10px;
    line-height: 1.7;
}
.gnb-privacy-p-b-10 li, .gnb-privacy-p-b-50 li{
    font-size: 16px;
    margin-bottom: 10px;
    line-height: 1.7;
}
.gnb-privacy-p-b-10 a, .gnb-privacy-p-b-50 a{
    font-weight: bold;
    transition:all 100ms ease;
}
.gnb-privacy-p-b-10 a:hover, .gnb-privacy-p-b-50 a:hover{
    color: var(--secondary-color) !important;
}
.gnb-privacy-head {
    font-size: 24px !important;
}
p.gnb-privacy-head {
    font-weight: bold;
    font-size: 20px !important;
}
.cnb_privacy_container {
    margin-top: 100px;
}
.gnb-overall-privacy-policy{
    padding:80px 0 50px; 
  }
.gnb-overall-privacy-policy .gnb-privacy-head {
	font-family:var(--bold);
    font-size: 23px !important;
}
  .gnb-privacy-p-b-10 p, .gnb-privacy-p-b-50 p{
    font-size: 16px !important;
      margin-bottom: 10px;
      line-height: 1.7;
      color: #222 !important;
  }
  .gnb-privacy-p-b-10 li, .gnb-privacy-p-b-50 li{
    font-size: 16px;
      margin-bottom: 10px;
      line-height: 1.7;
      color: #222 !important;
  }
  .gnb-privacy-p-b-10 a, .gnb-privacy-p-b-50 a{
      color: var(--secondary-color) !important;
      font-weight: bold;
      transition:all 100ms ease;
  }
  .gnb-privacy-p-b-10 a:hover, .gnb-privacy-p-b-50 a:hover{
      color: var(--main-color) !important;
    
  }
  .gnb-privacy-head {
      font-size: 24px !important;
      font-family:poppins;
  }
  p.gnb-privacy-head {
      font-weight: bold;
      font-size: 20px !important;
      font-family:poppins;
  }







  .hastings_btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 12px 24px;
        background-color: var(--main-color);
        color: #fff;
        border: 2px solid var(--light-color);
        border-radius: 10px;
        font-family: var(--reg);
        font-size: var(--fs-button);
        text-align: center;
        transition: var(--ease);
    }
    .hastings_btn:hover {
        transform: scale(0.92);
        border-color: var(--secondary-color);
    }
    .hastings_btn svg { width: 18px; height: 18px; flex-shrink: 0; }
    .hastings_btn_center { display: flex; width: fit-content; margin: 28px auto 0; }
    .hastings_btn_center .icon { transform: translate(7px, 0px) rotate(270deg); }
    .hastings_btn_sm { padding: 8px 16px; font-size: 16px; border-radius: 6px; }
    .hastings_btn_sm svg { width: 12px; height: 12px; }
    .hastings_btn_outline { background-color: transparent; border-color: var(--secondary-color); }
    .hastings_btn_outline:hover { background-color: var(--secondary-color); }
    .hastings_btn_group { display: flex; flex-wrap: wrap; gap: 12px; }

    /* ---------- 1. Properties ---------- */
    .hastings_properties img { display: block; width: 100%; }
    .hastings_section_title {
        margin: 0 0 24px;
        text-align: center;
    }
    .hastings_section_title_light { color: #fff; margin-bottom: 12px; }
    .hastings_subtitle {
        margin: -10px 0 20px;
        text-align: center;
        color: var(--secondary-color);
        font-size: var(--fs-body-sm);
    }
    .hastings_property_grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      grid-gap: 32px 24px;
  }
    .hastings_property_card {
    }
    .hastings_property_card img {
      border-radius: 5px 5px 0 0;
      object-fit: cover;
      background: #d9d9d9;
      transition: all 280ms ease;
      aspect-ratio: 5/3.5;
  }
    .hastings_property_card:hover img {
      transform: scale(0.98);
    }
    .hastings_property_card h3 {
      margin: 12px 0 14px;
      padding-inline: 8px;
      color: var(--black);
      font-family: var(--bold);
      font-size: 22px;
      font-weight: bold;
  }
    .hastings_features {
        display: flex;
        gap: 12px;
        padding-inline: 8px;
        font-size: 18px;
    }
    .hastings_features li i{
        font-size: 22px;
    }
    .hastings_features li {
      display: flex;
      align-items: center;
      gap: 10px;
      margin: 0;
      font-size: 18px;
      font-family: var(--bold);
      font-weight: bold;
      line-height: 1;
  }
    .hastings_features svg { width: 18px; height: 18px; flex-shrink: 0; }
    .hastings_price {
      margin: 12px 0 0;
      padding-inline: 8px;
      color: var(--main-color);
      font-family: var(--bold);
      font-size: 22px;
      font-weight: bold;
  }

    /* ---------- Shared image tiles (legal services + blog) ---------- */
    /* The blog row is a slick slider now, so only the legal row is still a
       grid here. */
    .hastings_card_row { display: grid; gap: 0px; }
    .hastings_card_row_4 { grid-template-columns: repeat(4, 1fr); }

    /* .banner_like_container supplies the dark image treatment, the radius and
       the dashed inset outline; this only handles the flex layout on top. */
    .hastings_overlay_card {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: flex-start;
        min-height: 190px;
        padding: 26px 22px;
    }
    .hastings_overlay_card h3 {
        margin: 0 0 12px;
        font-family: var(--bold);
        font-size: 22px;
    }
    .hastings_overlay_card_blog {
        align-items: center;
        min-height: 460px;
        text-align: center;
    }
    .hastings_overlay_card_blog h3 {
        font-size: 24px;
        margin-top: 80px;
    }
    .hastings_overlay_card_blog p {
        margin: 16px 0;
        font-size: 18px;
        line-height: 1.5;
    }

    /* ---------- 2. Legal Services ---------- */
    .hastings_legal {
        background-color: var(--dark-color);
        color: #fff;
    }
    /* The legal tiles reuse the .content-card system from the marketing
       section above. The grid supplies the 4/2/1 columns, so the flex-era
       min-width must be dropped, and the spacing matches .content-card-outer
       (30px gap and top margin). */
    .hastings_legal .content-card { min-width: 0; }
    .hastings_legal .hastings_card_row { gap: 24px; margin-top: 24px; }
    .hastings_card_row .content-card__title { font-size: 22px; line-height: 1.2; }
    .hastings_card_row .content-card__description p { line-height: 1.5; font-size: 18px; }
    .hastings_section_intro {
      max-width: 1050px;
      margin: 0 auto 20px;
      text-align: center;
      font-size: var(--fs-body);
      line-height: var(--lh-body);
      color: var(--secondary-color);
  }

    /* ---------- 3. Lettings ---------- */
    .hastings_lettings img { display: block; width: 100%; }
    .hastings_split {
        display: grid;
        grid-template-columns: 1fr 1fr;
        background-color: var(--dark-color);
        color: #fff;
    }
    .hastings_split img {
        height: 100%;
        min-height: 260px;
        object-fit: cover;
        background: #6a2fc0;
    }
    .hastings_split_content { padding: 32px 30px; }
    .hastings_split_content h2 {
        margin: 0 0 12px;
        color: #fff;
        font-size: 32px;
    }
    .hastings_split_content h3 {
        margin: 0 0 16px;
        color: var(--secondary-color);
        font-family: var(--reg);
        font-size: 22px;
    }
    .hastings_split_content p {
        margin: 0 0 16px;
        font-size: 18px;
        line-height: 1.6;
    }

    /* ---------- 4. App ---------- */
    .hastings_app {
        background-color: var(--dark-color);
        color: #fff;
    }
    .hastings_app img { display: block; width: 100%; }
    .hastings_app .hastings_badges img {
        max-width: 200px;
        background: #000;
        padding: 6px 10px;
    }
    .hastings_app_inner {
        display: grid;
        grid-template-columns: 1fr 1fr;
        align-items: center;
        gap: 30px;
    }
    .hastings_app_text { padding-left: 25px; }
    .hastings_app_text h2 {
        max-width: 510px;
        margin: 0 0 22px;
        color: #fff;
        font-size: 36px;
        line-height: 1.3;
    }
    .hastings_app_text p {
        margin: 0 0 20px;
        font-size: 18px;
        line-height: 1.6;
    }
    .hastings_badges { display: flex; flex-wrap: wrap; gap: 12px; }
    .hastings_badge {
        display: flex;
        flex-direction: column;
        padding: 8px 16px;
        background-color: var(--dark-color);
        border: 1px solid #ffffff3d;
        border-radius: 3px;
        color: #fff;
        font-size: 16px;
        line-height: 1.2;
    }
    .hastings_badge small { font-size: 10px; }
    .hastings_app_phone { max-width: 540px; margin-inline: auto; }

    /* ---------- 5. Blog ---------- */
    /* Section title, subtitle and tiles reuse the rules above. The tiles are
       a slick slider now, so the gaps the grid used to supply come from
       vertical margins on the slides, with the list pulled out by the same
       amount to keep the outer edges flush with the container. */
    .hastings_blog_slider .slick-list { margin: 0 -15px; }
    .hastings_blog_slider .hastings_overlay_card_blog {
        margin: 0 15px;
        border-radius: 4px;
    }

    /* ---------- 6. Testimonials ---------- */
    /* Each quote is a slick slide and has to span the full slide width - a
       max-width here made slick's slide maths disagree with the boxes on
       screen. The reading column stays narrow via the paragraph below, and
       the quote marks are anchored to that same 700px column (the offsets
       resolve against the slide, which is a positioned element). */
    .hastings_quote {
        position: relative;
        padding: 28px 20px 0;
        text-align: center;
        border-left: 0;
    }
    .hastings_quote p {
        max-width: 460px;
        margin: 0 auto 20px;
        font-size: 18px;
        line-height: 1.6;
    }
    .hastings_quote_mark {
        position: absolute;
        color: var(--secondary-color);
        font-family: var(--title);
        font-size: 5rem;
        line-height: 1;
    }
    .hastings_quote_mark_open { top: 20px; left: max(0px, calc(50% - 350px)); }
    .hastings_quote_mark_close { top: 110px; right: max(0px, calc(50% - 350px)); }
    .hastings_stars {
        display: flex;
        justify-content: center;
        gap: 2px;
        margin-bottom: 10px;
        color: var(--main-color);
    }
    .hastings_stars i { font-size: 16px; }
    .hastings_quote cite {
        display: block;
        margin-bottom: 12px;
        font-family: var(--bold);
        font-size: 17px;
        font-style: normal;
    }
    /* Every slider's dots now live in the row below it, so slick's dotted
       margin is not needed - the row supplies its own spacing. */
    .hastings_testimonial_slider.slick-dotted,
    .hastings_blog_slider.slick-dotted,
    .featured_prop_slider.slick-dotted { margin-bottom: 0; }

    /* Shared control row for the testimonial, blog and featured sliders:
       slick appends its arrows and dots here and flex order fixes the
       sequence it appends them in (arrows first, then dots). */
    .hastings_slider_controls {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        margin-top: 26px;
    }
    .hastings_slider_controls .slick-prev,
    .hastings_slider_controls .slick-next {
        position: static;
        transform: none;
    }
    .hastings_slider_controls .slick-prev { order: 1; }
    .hastings_slider_controls .slick-dots {
        position: static;
        order: 2;
        width: auto;
        bottom: auto;
    }
    .hastings_slider_controls .slick-next { order: 3; }

    /* ---------- 7. Footer ---------- */
    /* Background, text colours, link sizes and font stack all come from
       theme_style.css's footer rules; only the layout lives here. */
    .hastings_footer { position: relative; padding-top: 28px; }
    .hastings_footer_cols {
        display: grid;
        grid-template-columns: 1.2fr 1.1fr 1.3fr 1fr;
        grid-gap: 32px;
    }
    .hastings_footer h4 {
        margin: 0 0 10px;
        color: var(--secondary-color);
        font-family: var(--bold);
        font-size: 22px;
    }
    .hastings_footer li {
        margin-bottom: 6px;
        padding: 0;
        border: 0;
        display: block;
    }
    .hastings_footer a:hover { color: var(--secondary-color); }
    .hastings_footer .widget_social a:hover { background-color: var(--secondary-color); color: var(--white); }
    .hastings_footer .widget_social { margin-bottom: 16px; }
    .hastings_footer .widget_social i { font-size: 20px; }
    .hastings_footer_contact li { display: flex; align-items: center; gap: 8px; }
    .hastings_footer_contact i { width: 18px; font-size: 18px; flex-shrink: 0; text-align: center; }

    /* Copyright band. Bled to the viewport edges with margin maths rather than
       by moving it out of .default_container, so the markup stays put; the
       padding keeps the text aligned with the columns above on wide screens. */
    .hastings_footer_legal {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-top: 12px;
        padding: 20px max(20px, calc(50vw - 600px));
        background-color: var(--dark-color);
        color: #fff;
        border-top: 1px solid var(--secondary-color);
    }
    .hastings_footer_legal p {
        margin: 0 0 6px;
        color: #fff;
        font-size: 17px;
        line-height: 1.5;
    }
    .hastings_footer_legal strong { font-size: 18px; }
    .hastings_to_top {
        position: absolute;
        right: 24px;
        bottom: 20px;
        display: grid;
        place-items: center;
        width: 34px;
        height: 34px;
        background-color: var(--main-color);
        border-radius: 50%;
        color: #fff;
    }
    .hastings_to_top i { font-size: 16px; }

    /* ---------- Responsive ---------- */
    @media (max-width: 900px) {
        .hastings_property_grid,
        .hastings_card_row_4 { grid-template-columns: repeat(2, 1fr); }
        .hastings_footer_cols { grid-template-columns: repeat(2, 1fr); grid-gap: 24px; }
        .hastings_split,
        .hastings_app_inner { grid-template-columns: 1fr; }
        .hastings_split_content { padding: 28px 24px; }
        .hastings_app_text { padding-left: 0; }
    }

    @media (max-width: 560px) {
        .hastings_property_grid,
        .hastings_card_row_4,
        .hastings_footer_cols { grid-template-columns: 1fr; }
        .hastings_property_grid { gap: 20px; }
        .hastings_section_title { margin-bottom: 20px; }
        .hastings_quote_mark { display: none; }
        .hastings_to_top { right: 16px; }
    }









  @media (max-width:855px){
  	.gnb-privacy-p-b-10 p, .gnb-privacy-p-b-50 p, .gnb-privacy-container ul li {
	    font-size: 15px !important;
	}
	.gnb-privacy-p-b-10 li, .gnb-privacy-p-b-50 li {
	    margin-bottom: 0;
	}
	.gnb-overall-privacy-policy .gnb-privacy-head {
	    font-size: 21px !important;
	}
	.cnb_privacy_container {
	    margin-top: 50px;
	}
  }
  @media (max-width: 480px){
		 .gnb-overall-privacy-policy ul, .gnb-overall-privacy-policy li {
			    margin: 0 0 10px;
			}
		}



@media (max-width:992px){
h2 {
    font-size: var(--fs-h2);
}

}
@media (max-width:768px){
h2 {
    font-size: var(--fs-h2);
}
}
@media (max-width:576px){
.t_center {
    max-width: 100%;
}
section {
    padding: var(--section-pad) 0;
}
}