

/* reset css */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
    vertical-align: middle;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	margin: 0;
  font-family: 'Poppins', sans-serif;
  background: #fff;
  color: var(--global-color);
  
}
html {
  scroll-behavior: smooth;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

.clearfix::after {
    content: "";
    clear: both;
    display: table;
  }

  ::-webkit-input-placeholder { /* Edge */
    color: #797979;
    font-size: 13px;
    font-weight: 300;
  }
  
  :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #797979;
    font-size: 13px;
    font-weight: 300;
  }
  
  ::placeholder {
    color: #797979;
    font-size: 13px;
    font-weight: 300;
  }

  :root {
    --orange: #E06D25;  
    --orange-hover: #d76721;
    --global-color: #171717;
    --red-color: #B8422D;
    --font-500:500;
  }

.container { max-width: 1270px; margin: 0 auto;}
.orange_btn { background: var(--orange); border: none; gap: 10px; color: #fff; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; border-radius: 3rem; padding: 0.7rem 2.5rem; font-size: 18px; text-decoration: none; display: inline-flex;}
.orange_btn:hover { background:var(--orange-hover); color: #fff; text-decoration: none;} 
h2 { font-size: 35px; font-weight:600;}

.blue_btn { background: #0e2650;  color: #fff; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; border-radius: 3rem; padding: 0.7rem 2.5rem; font-size: 18px; text-decoration: none; display: inline-flex;}
.blue_btn:hover { background: #091F44; color: #fff; text-decoration: none;}
/* header */


header .top { background: var(--orange); color: #fff;}
header .top .latest_news { padding: 0 2rem 0 0 ; border: none; margin: 0;}
header .top .latest_news .btn-close { position: absolute; right: 0; top: 5px;}
header .bottom .container {display: flex;  align-items: center; justify-content: space-between;}
header .bottom { background:#fff; display: flex; padding:1rem; align-items: center; justify-content: space-between;}
header .top .left a{ color: #fff; font-size: 13px; text-decoration: none; font-weight: normal; margin: 0 0.4rem;}
/* header .bottom.is-sticky {position: fixed; box-shadow: 0 5px 16px rgba(0, 0, 0, 0.1); backdrop-filter: blur(10px); animation: slideDown 0.35s ease-out; width: 100%; z-index: 999; top: 0;}
header .bottom.is-sticky .left .logo img{ width: 180px;}
@keyframes slideDown {
  from {
    transform: translateY(-100%);
  }
  to {
    transform: translateY(0);
  }
}

.text{
  padding: 0 1rem;
  white-space: nowrap;
  font-size: 15px;
  font-weight: 400;
} */
.dropdown-menu {
  animation: 0.5s slideup;
}

@keyframes slideup {
  from {
    transform: translateY(10%);
  }

  to {
    transform: translateY(0);
  }
}

header .bottom .right { display: flex; justify-content: flex-end;}
header .bottom .left .logo { background: #fff; position: absolute; z-index: 99; top: 0;box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.2); border-radius: 0 0 6rem 6rem; padding:0.5rem 1rem 1.5rem 1rem;}
header .bottom .left .logo img { width: 110px;}
header .bottom .navbar { padding: 0;}
header .bottom .navbar .navbar-toggler { padding: 0.2rem 0.3rem; position: absolute; right: 0; top:-27px; height: auto; border: none;}
header .bottom .navbar .navbar-toggler:focus { box-shadow: none;}

header .bottom .navbar-toggler-icon { background-size: 25px 25px; height: 1.2em;}
header .bottom .navbar .navbar-nav { align-items: center;}
header .bottom .navbar .navbar-nav a.nav-link {  color: #343434;  padding-left: 0; padding-right: 0; margin: 0 0.8rem; font-size: 17px; font-weight: 500; position: relative;}
header .bottom .navbar .navbar-nav a.nav-link:hover { color: var(--orange-hover);}
header .bottom .right .call_us { color: #fff; background-color: var(--orange); border-radius: 3rem; padding: 0 1.5rem 0 0.2rem; display: flex; align-items: center; margin-left: 1rem;}
header .bottom .right .call_us a { color: #fff; text-decoration: none;}
header .bottom .right .call_us img { margin-right: 0.5rem;}


.banner {padding:0;}
.banner h1 { font-size: 45px; font-weight:600; line-height: 55px;}
.banner .carousel-caption { text-align: left; left: 10%; bottom: auto; top: 25%;}
.banner .carousel-caption h3  { display: inline-block; font-size: 32px; background: rgba(0, 0, 0, 0.9); padding: 1.5rem 2.5rem; border-radius: 15px;}
.banner .carousel-caption h3 b  {font-weight:600; font-size: 35px; display: block;}
.banner .carousel-control-next, .banner .carousel-control-prev { display: none;}
.banner .carousel-indicators { justify-content:flex-start; margin-left: 4%; margin-bottom: 3rem;}
.banner .carousel-indicators [data-bs-target] { text-indent: unset; margin: 0 2rem 0 0; font-size: 14px; position: relative; background: transparent; width: auto; height: auto; color: #fff;}
.banner .carousel-indicators [data-bs-target]::before { content: ''; position: absolute; height: 3px; top: -1rem; width: 100%; background: #fff;}


.about_company .outer { display: flex;overflow: hidden; position: relative; margin-top: -2rem; position: relative; z-index: 9; align-items: center; justify-content: space-between; background: #fff; border-radius: 25px; padding: 3rem; box-shadow: 0px 4px 50px rgba(0, 0, 0, 0.07);}
.about_company .left { width: 60%;}
.about_company .right img { max-width: 100%;}
.about_company .left h2 { font-size: 32px; font-weight:600; line-height: 47px;}
.about_company .left p { margin: 1rem 0;}
.about_company .left .mission { font-size: 18px; font-weight: 500;}
.about_company .right { width: 45%; position: absolute; right: -60px; bottom: -50px;}
.cta_btn { color: var(--orange); text-decoration: none; font-size: 16px; }
.cta_btn img { transition: transform 0.3s ease}
.cta_btn:hover { color: var(--orange-hover);}
.cta_btn:hover img { transform: rotate(20deg);}


.services { background: url('../img/service-banner.jpg') center center no-repeat; background-size: cover; padding: 6rem 0 4rem 0; margin-top: -2rem;}
.services .outer { margin-top: 2rem; display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between;}
.services h2 { font-size: 35px; font-weight:600; color: #fff;}
.services .sub_pera { color: #fff; font-size: 17px;}
.services .panel { width: 48%; margin-bottom: 1rem; color: #fff; border-radius: 2rem; padding: 3rem;}
.services .panel h3  {font-size: 30px; color: #fff; font-weight: 600; margin: 1rem 0;}
.services .panel p { font-size: 20px;}
.services .panel.ploan { background: var(--red-color);}
.services .panel.dwelling_Loans { background: var(--orange);}
.services .panel a.read_more { background: #fff; text-decoration: none; font-size: 18px; margin-top: 2rem; display: inline-flex; align-items: center; gap: 5px; font-weight: 500; border-radius: 3rem; color: #000; padding: 0.7rem 2.5rem;}
.services .panel a.read_more img { transition: transform 0.3s ease}
.services .panel a.read_more:hover img { transform: rotate(20deg);}
.services .panel.ploan { background: var(--red-color);}

.company_usps { padding: 4rem 0;}
.company_usps h2 { margin-bottom: 2rem;}
.company_usps .panel { display: flex; padding: 1rem 0 0 0; }
.company_usps .panel figure { margin-right: 1.5rem;}
.company_usps .panel p { margin-top: 0.3rem;}
.company_usps .panel h3 { font-weight: 600; font-size: 22px;}

.why_us { background:url('../img/large-logo.svg') left center no-repeat var(--red-color); padding: 4rem 0;}
.why_us .outer { display: flex; justify-content: space-between;}
.why_us h2 { color: #fff; font-weight: 500;}
.why_us .box { width: 32%; background: #fff; margin: 2rem 0; border-radius: 1rem; padding: 2.5rem;}
.why_us .box h3 { font-size: 20px; font-weight: 600; margin-bottom: 0.5rem;}
.why_us span { text-align: center; color: #fff; font-size: 22px; display: block;}

.tagline_logo { padding: 4rem 0;}
.tagline_logo figure { background: #fff; display: inline-flex; width: 180px; height: 180px; align-items: center; justify-content: center; box-shadow: 0 5px 8px rgba(0, 0, 0, 0.07); border-radius: 10rem;}
.tagline_logo { font-size: 30px; font-style: italic; font-weight: 500;}


footer { background: #000; font-weight: 400; font-size: 15px;}
footer .container { display: flex; text-align: center; flex-wrap: wrap; justify-content:space-between; }
footer .social_share {  margin: 2rem 0; display: flex; align-items: center; gap: 10px;}
footer .social_share a { margin: 0 0.3rem; text-decoration: none; opacity: 0.7;}
footer .social_share a img { width: 16px;}
footer .social_share a:hover { opacity: 1;}
footer .contact_dtl { display: flex; align-items: center; flex-wrap: wrap; color: #000; justify-content: center;}
footer .contact_dtl span { color: #fff; background-color: var(--orange); border-radius: 3rem; padding: 0.3rem 2rem 0.3rem 0.3rem; display: flex; align-items: center; gap: 5px; margin-left: 1rem;}
footer .contact_dtl span a { color: #ddd; text-decoration: none;}
footer .footer_nav ul { display: flex; flex-wrap: wrap; justify-content: center; margin: 2rem 0; padding: 0;}
footer .footer_nav ul li {line-height: 15px; padding: 0 0.8rem; margin: 0.3rem 0;}
footer .footer_nav ul li a  {color: #ddd; font-weight: 500; text-decoration: none;}
footer .footer_nav ul li:last-child { border: none;}
footer .footer_bottom { border-top: solid 1px rgb(22, 22, 22); color: #ddd; font-size: 13px; font-weight: 400; padding: 0.8rem 0; display: flex; align-items: center; justify-content: space-between;}
footer .footer_bottom .policy a { text-decoration: none; color: #ddd;}

/* about us page  */
.aboutbanner { background: url('../img/about-us/aboutus-banner.jpg') center center no-repeat; color: #fff; padding: 4rem 0;}

.aboutus_page .about_company .right { width: 38%; text-align: right; position: relative; right: auto; bottom: auto;}
.aboutus_page .about_company .left span { border-radius: 3rem; border-radius: 16px;
  background: linear-gradient(270deg, #FF924E 1.87%, #DC7535 98.49%); color: #fff; font-size: 18px; font-weight: 500; padding: 1.5rem; display: flex;}


.aboutus_page .vision_mission { margin-top: -15rem;}
.aboutus_page .vision_mission .outer { margin-top: 2rem; display: flex; justify-content: space-between;}
.aboutus_page .vision_mission .panel { width: 48.5%; background: #fff; box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.08);  margin-bottom: 1rem; border-radius: 2rem; padding: 2rem;}
.aboutus_page .vision_mission .panel img { max-width: 100%;}
.aboutus_page .vision_mission .panel h3  {font-size: 27px; padding-left: 1rem; border-left: solid 5px var(--orange); line-height: 25px; font-weight: 600; margin: 1.5rem 0;}
.aboutus_page .vision_mission .panel p { font-size: 16px;}

.sectionback_bg { background: var(--red-color); height: 350px; width: 90%; opacity: 0.7; margin-top: -6rem; border-radius: 0 12rem 12rem 0;}

.aboutus_page .board_director { padding: 4rem 0; margin-top: 2rem; background: #EEEEF5;}
.aboutus_page .board_director h2 { font-size: 35px; text-align: center; font-weight:600;}
.aboutus_page .board_director .outer { width: 82%; margin:  0 auto; margin-top: 2rem; display: flex; justify-content: space-between;}
.aboutus_page .board_director .panel { width: 47%; margin-top: 1rem; text-align: center;}
.aboutus_page .board_director .panel img { max-width: 80%;}
.aboutus_page .board_director .panel h3  {font-size: 27px; font-weight: 600; margin: 1.5rem 0 0.5rem 0;}

/* services page */
.servicebanner { background: url('../img/services/services-banner.jpg') center center no-repeat; color: #fff; padding: 4rem 0;}

.services_page .service_section { display: flex;overflow: hidden; position: relative; margin-top: -2rem; position: relative; z-index: 9; align-items: center; justify-content: space-between; background: #fff; border-radius: 25px; padding: 3rem; box-shadow: 0px 4px 50px rgba(0, 0, 0, 0.07);}
.services_page .service_section h2 { margin-bottom: 1rem;}
.services_page .service_section h3 { font-weight: 600; font-size: 1.3rem;}
.services_page .key_features ul { display: flex; flex-wrap: wrap; justify-content: space-between; } 
.services_page .key_features ul li {  width: 48%; display: flex;margin: 1rem 0; align-items: flex-start; gap: 20px; } 
.services_page .key_features ul li strong { display: block; font-size: 1.1rem; margin-bottom: 0.3rem;}

.services_page .list_design li { padding-left: 1rem; border-radius: 0.3rem 0 0 0.3rem; border-left: solid 5px var(--orange); margin: 1.5rem 0;}
.services_page .list_design li strong  { display: block; font-size: 1.1rem; font-weight: 600; }
.services_page .hilight { background: #EDEDF9; padding: 1.5rem; border-radius: 1rem;}


.contactbanner { background: url('../img/contacus-banner.jpg') center center no-repeat; color: #fff; padding: 4rem 0;}
.contactus_page { padding-bottom: 3rem;}
.contactus_page h2 { font-size: 1.5rem; margin: 2rem 0 1rem 0;}
.contactus_page .office_address { padding: 2rem; margin-top: -2rem; border-radius: 1rem; display: flex; flex-direction: column; background: var(--orange); color: #fff;}
.contactus_page .office_address.cp_office{ background: var(--red-color);}
.contactus_page .office_address img { width: 50px;}
.contactus_page .office_address strong {  font-weight: 500; font-size: 1.3rem; display: block; margin: 0.5rem 0;}
.contactus_page .customer_griviance { padding: 2rem; display: flex; justify-content: center; flex-wrap: wrap; border-radius: 1rem; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);}
.contactus_page .customer_griviance strong { font-size: 1.1rem; display: flex; text-align: center; justify-content: center; font-weight: 500;}
.contactus_page .customer_griviance .download_btn { background: var(--orange); display: inline-flex; margin-top: 1rem; border-radius: 3rem; padding: 0.6rem 2.5rem; text-decoration: none; color: #fff;}
.contactus_page .customer_griviance .download_btn:hover { background: var(--orange-hover);}
[data-animate-in] {
  opacity: 0;
  transition: transform 0.8s ease, opacity 0.8s ease
}

[data-animate-in="up"] {
  transform: translate3d(0, 24px, 0)
}

[data-animate-in="left"] {
  transform: translate3d(-25%, 0, 0)
}

[data-animate-in="right"] {
  transform: translate3d(25%, 0, 0)
}

[data-animate-in="down"] {
  transform: translate3d(0, -24px, 0)
}

[data-animate-in="fadeIn"] {
  transform: translate3d(0, 0, 0)
}

[data-animate-in].in-view {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0, 0, 0);
  transition: transform 0.6s ease, opacity 0.6s ease
}

.fade-in {
  opacity: 0;
  transition: opacity 1s ease
}

.page-loaded .fade-in,.page-loaded.fade-in {
  opacity: 1
}

.isSafari.isTouch [data-animate-in],.isSafari.isTouch [data-animate-in="up"] {
  opacity: 1;
  transition: none;
  transform: none
}


@media only screen and (min-device-width: 1601px) and (max-device-width: 1920px) {

}

@media only screen and (max-width:1024px){ 

 
}


@media only screen and (max-width:992px){
  .container, footer .container { max-width: 100%;}
  h2 { font-size: 22px !important; line-height: 28px !important;}
  p { font-size: 13px !important;}
  header .bottom .right .call_us, .about_company .right { display: none;}
  header .bottom { height: 50px;}

  header .bottom .navbar .navbar-toggler  {top: -12px; z-index: 9999999;}
header .bottom .navbar .navbar-toggler[aria-expanded="false"] .navbar-toggler-icon {background: url(../img/nav_icon.svg) right center no-repeat; width: 23px; height: 20px; transition: all .1s;}
header .bottom .navbar .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {background: url(../img/close.svg) right center no-repeat; width: 23px; height: 20px; transition: all .1s;}
header .bottom .navbar .navbar-collapse {position: fixed; border-radius: 0 0 10px 10px; bottom: 0; align-items: flex-start; background: #fff; top: 0; display: inline-table; transition: all .3s ease-out; height: 100vh; width: 100%; left: -100%; z-index: 99;}

header .bottom .navbar .navbar-collapse.active{ left: 0; top: 0;}
header .bottom .navbar .navbar-nav a.nav-link { font-size: 16px; color: #000; display: flex; align-items: center; justify-content: space-between;}
header .bottom .navbar .navbar-nav li { width: 100%; text-align: left; padding: 0.1rem 1rem; border-bottom: solid 1px #e9ecee;}
header .bottom .navbar .navbar-nav li .dropdown-menu { background: #fff; border: none; margin-top: 0; padding-top: 0;} 
header .bottom .navbar .navbar-nav li .dropdown-menu li  {border: none; padding: 0;}
header .bottom .navbar .navbar-nav li .dropdown-menu li a { color: #666; padding: 0.3rem 1rem; font-size: 14px;}
header .bottom .navbar .navbar-nav a.nav-link:hover { color: var(--orange); font-weight: 500;}


  .banner h1 { font-size: 1.6rem; line-height: 30px; text-align: center; margin-top: 1rem;}
  .about_company .outer { padding: 1.5rem;}
  .about_company .left { width:auto;}
  .about_company .left p { font-size: 14px;}
  .about_company .left .mission { font-size: 16px;}

  .services { background-size: cover; padding: 3rem 0 1rem 0;}

  .aboutbanner { background-size: cover; padding: 2rem 0;}
  .aboutus_page .vision_mission .panel h3, .aboutus_page .board_director .panel h3 { font-size: 20px; margin: 1rem 0;}
  .aboutus_page .board_director .panel img { max-width: 50%;}
  .aboutus_page .board_director { padding: 2rem 0; margin-top: 1rem;}
  .aboutus_page .board_director .outer { margin-top: 1rem;}

  .servicebanner, .aboutbanner, .contactbanner { padding: 2rem 0 2.5rem 0; height: 120px;}
  .servicebanner br, .aboutbanner br { display: none;}
  .services_page .service_section { padding: 1.5rem;}
  .services_page .service_section h3 { font-size: 1.1rem;}
  .services_page .list_design li strong { font-size: 1rem;}
  .services_page .key_features ul li strong { font-size: 1rem;}
  .services_page .key_features ul { flex-direction: column;}
  .services_page .key_features ul li { width: 100%;}
  .services_page .list_design li { font-size: 13px;}

  .contactus_page .office_address { margin-bottom: 3rem;}
  .contactus_page .office_address.cp_office { margin-bottom: 0;}



}
@media only screen and (max-width:768px){ 
  h2 { font-size: 20px !important; line-height: 28px !important;}
  .company_usps, .why_us, .tagline_logo { padding: 2rem 0;}
header .bottom .navbar .navbar-nav  { margin-top: 0; padding-top: 2rem;}
header .bottom .left .logo img { width: 80px;}
header .bottom { padding: 0.3rem 0;}

.about_company .left p { font-size: 14px;}

.services .panel { width: 49%; padding: 1.5rem;}
.services .panel h3 { font-size: 18px; margin: 0.5rem 0;}
.services .panel a.read_more { margin-top: 0; font-size: 15px; padding: 0.5rem 1.5rem;}

.company_usps .panel h3 { font-size: 16px;}
.why_us .outer { flex-direction: column;}
.why_us .box { width: auto; margin: 1rem 0 0 0;}
.why_us span { font-size: 16px; line-height: 20px; margin-top: 1rem;}

footer .contact_dtl { display: none;}
.aboutus_page .vision_mission .outer { flex-direction: column; width: auto;}
.aboutus_page .vision_mission .panel { width: auto; padding: 1.5rem;}

.contactus_page .office_address strong { font-size: 1.1rem;}
.contactus_page .customer_griviance strong { font-size: 1rem;}

}

@media only screen and (max-width:580px){
  h2 { font-size: 20px !important; line-height: 23px !important;}
  .banner h1 { font-size: 1.2rem; line-height: 24px;}
  .banner h1 br { display: none;}
  .banner .carousel-caption { padding-top: 0;}
 
  .about_company .outer, .services_page .service_section  { margin-top: -0.5rem;}

  .services .outer { flex-direction: column;}
  .services .panel { width: auto;}

  .company_usps .container { width: 100% !important;}
  .company_usps h2 { margin-bottom: 1rem;}
  .company_usps .panel { padding-top: 0;}

  .why_us h2 br { display: none;}

  footer .container { flex-direction: column; justify-content: center;}
  footer .social_share { justify-content: center;}
  footer .footer_nav ul { margin-top: 0;}
  footer .footer_bottom { flex-direction: column; justify-content: center;}
  footer .footer_bottom .policy { display: block; margin-top: 0.5rem;}
  
  .aboutus_page .board_director .outer { width: auto; flex-direction: column;}
  .aboutus_page .board_director .panel { width: auto;}
  .aboutus_page .board_director .panel img { max-width: 50%;}

  .servicebanner { background-size: cover;}
  .servicebanner, .aboutbanner { height: auto;}
  .services_page .key_features ul li { gap: 10px;}
  .services_page .key_features ul li img { width: 50px; height: auto;}
  .services_page .key_features ul li strong, .services_page .list_design li strong { font-size: 0.95rem;}
  .services_page .hilight { font-size: 14px;}



 }
