@media(max-width:1399px) {
h1 {font-size: 70px;Line-height: 73px;}
.hero-banner .hero-content h1 {margin-bottom: 13px;}
h2{font-size: 58px;line-height: 69px;}
#faq_1 .accordion-button {font-size: 20px;}
#faq_1 .accordion-body {font-size: 22px;}
header .btn-primary{padding: 12px 20px;}

}
@media(max-width:1299px) {
h1{font-size: 63px;Line-height: 61px;}
h5{font-size: 17px;line-height: 26px;}
.hero-banner {height: 645px;}
#menu ul li a{font-size: 14px;}
.owners-sec .choice-heading h4{font-size: 24px;line-height: 34px;}
.design-sec .design-main .design-content ul li {font-size: 22px;}
header .btn-primary {padding: 9px 18px;}
}

@media (max-width:1199px) {
h1 {font-size: 56px;Line-height: 58px;}
h2 {font-size: 52px;line-height: 63px;}
.hero-banner .hero-content p{color: #E6E6E6;font-size: 17px;line-height: 25px;}
.btn-primary {font-size: 14px;}
.btn-white {padding: 15px 17px;}
#menu ul li a{padding: 8px 13px;}
.remodel-card .remodel-img {max-height: 157px;min-height: 157px;}
.remodel-heading {margin-bottom: 37px;}
.remodel-card h5{min-height: 43px;}
.remodel-sec{padding: 40px 0;padding-top: 80px;}
.owners-sec .choice-heading h4{font-size: 21px;line-height: 1.3;}
.work_sec .work-main {padding: 44px 28px;}
#faq_1 .accordion-button {font-size: 18px;}
#faq_1 .accordion-body {font-size: 18px;}
.faq-sec .faq-block {padding: 32px 83px 0;}
.faq-sec .faq-block h2 {margin-bottom: 28px;}
.design-sec .design-main {padding: 32px 26px;}
.design-sec .design-main .design-content ul li{font-size: 18px;padding: 19px 0;}
.q-card h3 {font-size: 23px;margin-bottom: 24px;}
header .btn-primary {font-size: 11px;padding: 9px 10px;}








}
@media (max-width:1024px) {
#menu ul li a {font-size: 12px;padding: 6px 11px;}
.hero-more-btn li a {font-size: 14px;}
.hero-banner {height: 535px;}
.remodel-card p{  font-size: 14px;}
header .btn-white {width: 23px;}

}
@media(max-width:991px){

header{top: 40px;}
.topbar { width:100%; position:relative;z-index: 999; }
.topbar .logo a{font-size: 32px;font-weight: 400;}
header .logo{width: 180px;}

.topbar ul.top_right_contents{padding:0 ;margin:8px 0 0 0;list-style:none;color: #000; text-align: center;}
.topbar ul.top_right_contents li{vertical-align:middle; position:relative; display: inline-block; line-height: 1;text-align: end;}
.topbar ul.top_right_contents li a.menu_open i {font-size: 30px;color: #000;}
.topbar ul.top_right_contents li a:focus-visible{border: none;outline: none;}

.topbar.sticky{margin:0;position:fixed;top:0;left:0;width:100%;z-index:999;animation-name:menu_sticky;animation-duration:.6s;animation-timing-function:ease-out;
background-color: var(--black);padding: 6px 0;}
.topbar.sticky .logo{max-width: 125px;}
.topbar ul.top_right_contents{padding:0;margin:0;list-style:none; text-align: right;}
.topbar ul.top_right_contents li{vertical-align:middle; position:relative; display: inline-block;margin-right: 20px;  line-height: 1;}
.topbar ul.top_right_contents li:last-child {margin-right: 0;}
.topbar ul.top_right_contents li a{line-height: 1;transition: all .2s ease; background: white;width: 44px;height: 44px;display: flex;align-items: center;justify-content: center;border-radius: 50%;}
.topbar ul.top_right_contents li a:hover{background-color: var(--black);}
.topbar ul.top_right_contents li a img{transition: all .2s ease;}
.topbar ul.top_right_contents li a:hover img{filter: invert(1);}
.topbar ul.top_right_contents li a i {font-size: 26px;}
.topbar ul.top_right_contents li a i.user { font-size: 34px;}
.topbar ul.top_right_contents li a.menu_open img{width: 19px;}
.menu_overlay {position: fixed; top:0; right:0; bottom:0; left:0; z-index:9999; background: rgba(0,0,0,0.75);}
.menu_toggler {margin:15px 0 0;}
.menu_toggler .icons {font-size:26px; color:#212121}
.menu_head {background:#000;text-align: center; position: relative;color:#fff;}
.menu_head a {color:#fff; padding:15px 10px; display: inline-block; font-weight: 500; font-size: 16px;}
.menu_close {text-align: start; margin-bottom: 33px;padding: 0;}
.menu_close a{height: 44px;width: 44px;border-radius: 50%;display: flex;align-items: center;justify-content: center;background: var(--white);transition: all .3s ease-in;}
.menu_close a:hover{background: var(--black);}
.menu_close a img{width: 24px;transition: all .3s ease-in;}
.menu_close a:hover img{filter: invert(1);}
.mobile_menu_wrap {position: fixed; top:0px; bottom: 0; right:-100%; z-index:99999; padding:0 0 75px; transition: all  .3s ease-in  ; transition-delay: .1s; max-width: 80%; width: 300px; height: 100vh;}
.mobile_menu_wrap .form-control{width: 80%;}
.mobile_menu_wrap.menu_show {right:0; background: var(--primary);        padding:0 20px;border-radius: 20px 0 0 20px;}
.mobile_menu_wrap ul { margin:10px 0 0 0; list-style:none; font-size: 16px;font-weight: 400;}
.mobile_menu_wrap ul.main_menu {margin-bottom: 10px;}
.mobile_menu_wrap ul.main_menu li{padding:0 ;color: var(--white);}
.main_menu li.active a{font-weight: bold;}
.mobile_menu_wrap ul.main_menu li a {font-size:17px; text-decoration: none;}
.mobile_menu_wrap ul li a {position: relative; display: block;margin-top: 20px; width: 100%; color: var(--white);}
.mobile_menu_wrap ul li.hassub {position: relative;width: 100%;display: inline-block;}
.mobile_menu_wrap ul li.hassub .sub_menu_open {position: absolute;right: 0;top: 1px;font-size: 18px;width: 100%;text-align: end;}
.mobile_menu_wrap ul li.hassub ul {position: fixed; top:0; bottom:0; right:-100%; max-width: 80%; width: 220px;background-color: #F7F7F7; margin:0; transition: all linear 0.3s; padding:48px 0 100px; overflow: auto; z-index: 9; visibility:hidden; box-shadow: 0 4px 16px 0 #00000020;border-left:1px solid var(--dark2) ;padding-left: 20px;}
.mobile_menu_wrap ul li.hassub ul li a{color: var(--black);}
.mobile_menu_wrap ul li.hassub ul.show_submenu {visibility: visible; right: 0;}
.mobile_menu_wrap ul li.hassub ul li.back_to_mainmenu {position: absolute; top:0; width: 100%; background: var(--dark);left: 0;}
.mobile_menu_wrap ul li.hassub ul li.back_to_mainmenu a {font-size:15px; color: #fff; padding:10px;margin-top: 0px;line-height: 0;display: flex;align-items: center;}
.mobile_menu_wrap ul li.hassub ul li.back_to_mainmenu a i.bi {margin-right: 3px;}

section {padding: 40px 0;}
.hero-banner {min-height: 710px;}
.hero-banner::after{z-index: 0;}
.hero-banner .container{z-index: 1;}
.hero-banner .hero-content h1 { margin-bottom: 13px;max-width: 480px;}
.hero-banner .hero-content p {max-width: 400px;margin-bottom: 16px;}
.hero-more-btn {    gap: 14px;    flex-wrap: wrap;}
.btn-white {width: 44px;height: 44px;display: flex;align-items: center;justify-content: center;}
.hero-responsive-btn{display: flex;align-items: center;}
.btn-white img {height: 13px;}
.remodel-sec .row + .row{row-gap: 24px;}
.remodel-card h5 {min-height: auto;}
h2 {font-size: 44px;line-height: 52px;}
.remodel-heading {margin-bottom: 32px;}
.list_card{justify-content: end;row-gap: 24px;margin-bottom: 50px;}
h3 {font-size: 36px;line-height: 40px;}
.list_box{padding-top: 10px;}
.livo_sec .back-ground-white{padding: 26px 20px;}
.livo-img .livo-icon{width: 100px;height: 100px;}
.livo-img .livo-icon img{max-width: 50px;max-height: 50px;}
.livo-heading{margin-bottom: 37px;}
.livo-content .num{font-size: 14px;}
.build-sec .grid-box {gap: 16px;}
.build-sec .grid-box .build-card,.build-sec .grid-box .build-img {order: unset;}
.build-sec .grid-box .build-card:nth-child(1) {grid-column: 1 / span 5;grid-row: 1;}
.build-sec .grid-box .build-img {grid-column: 6 / span 5;grid-row: 1;}
.build-sec .grid-box .build-card:nth-child(4) {grid-column: 1 / span 5;grid-row: 2;}
.build-sec .grid-box .build-card:nth-child(2) {grid-column: 6 / span 5;grid-row: 2;}
.build-sec .grid-box .build-card:nth-child(5) {grid-column: 1 / span 10;grid-row: 3;}
.build-sec .build-card p{font-size: 24px;}
.build-sec .build-card {padding: 24px;}
.possible-heading h2{margin-bottom: 34px;}
.matter-sec .projects{flex-wrap: wrap;justify-content: center;}
.projects .matter-project{flex: 0 0 auto;width: 40%;min-width: 120px;}
.matter-sec .tag{margin-top: 34px;}
.matter-sec .main-box{padding: 28px;}
.owners-sec .main-box{padding: 30px;}
.owners-sec .choice-text p{font-size: 15px;line-height: 1.3;}
.owners-sec .tick, .owners-sec .cross{width: 32px;height: 32px;}
.renovation-sec .points ul{flex-wrap: wrap;}
.renovation-sec .main-box{padding: 52px 30px;}
.fead-sec .img-box{margin-bottom: 48px;}
.livo-content .num{position: relative;left: unset;right: unset;margin-inline: unset;    }
.proBarcontainer {left: 19px;height: 87%;}
.work_img {width: 100%;margin-top: 20px;}
.work_sec .work-main:nth-child(even) .row .work_img{width: 100%;}
.work-main .work-content-main {  flex-direction: column;}
.work_sec .work-main:nth-child(even) .row .work-content-main{flex-direction:column  ;}
.work-main .numbering {width: 42px;}
.work-main .work-content p {max-width: unset;} 
.work_sec .work-main {padding: 25px 28px;}
.work-main .work-content h2 { max-width: unset;}
.faq-sec .faq-block {padding: 32px 33px 0;}
.render-heading{margin-bottom: 24px;text-align: center;}
.design-sec{    padding-bottom: 80px;}
.post-card .post-img ,.dream-sec .post-img  {max-width: unset;}
.post-card .post-img img ,.dream-sec .post-img img {margin-bottom: 0;}

.inner-header .topbar ul.top_right_contents li a{background-color: var(--black);}
.inner-header .topbar ul.top_right_contents li a img{filter: invert(1); }
.post-card {padding: 22px;}
.post-sec{padding: 48px 0 30px 0;}
.recent-sec h2 {margin-bottom: 38px;}
.recent-sec .post-card {
gap: 0;
}

.inner-header .topbar.sticky{background-color: white;        padding: 13px 0;}

.dream-details p {margin-bottom: 24px;}
.dream-card .dream-img {border-radius: 24px;}
.dream-card {
border-radius: 24px;
padding: 32px 20px;
}
.dream-sec{padding: 80px 0 30px 0;}

.work_sec .repeater-box .work-main:nth-child(even) .row .work-content-main {
    flex-direction: column;
}
    .matter-sec_2 .projects .matter-project {
        width: 100% !important;
        height: 100%;
        padding-inline: 6px;
    }




/* afzaal css */



.btn-grey{margin-bottom: 32px;}
.post-card .post-details h1 {font-size: 24px;}
.about-sec .about-details h1 {font-size: 44px;}
.about-sec .about-details p {margin-bottom: 32px;}
.about-sec .about-details {max-width: unset;}


/* afzaal css */

.q-card .q-top{flex-direction: column-reverse;}
.q-card .q-top .cross{gap: 10px;flex-direction: row-reverse;margin-bottom: 20px;}

.banner-sec .detail-heading h1 {font-size: 36px;line-height: 45px;}





}

@media (max-width:767px) {
.remodel-card .remodel-img {border-radius: 12px;}
.remodel-card .remodel-img img {border-radius: 12px;}      
.remodel-card h5 {min-height: 52px;}
.remodel-card .remodel-img {max-height: none;min-height: auto;width: 100%;aspect-ratio: 16/10.78;}
.recent-sec .remodel-btn{width: fit-content;margin-inline: auto;margin-top: 8px;}
h3{font-size: 28px;line-height: 34px;}
.livo-img .livo-icon{width: 80px;height: 80px;}
.livo-img{aspect-ratio: 16/9;}
.livo-content p{font-size: 16px;line-height: 18px;}
.livo-content h3 {margin-bottom: 12px;}
.livo-heading{margin-bottom: 24px;}
.livo-heading p{font-size: 16px;}
.livo-content .num{font-size: 12px;}
.build-sec .build-card p{font-size: 18px;}
.build-card,.build-sec .build-img{height: auto;aspect-ratio: 1/1.1;}
.build-sec .grid-box .build-card:nth-child(5){width: 100%;aspect-ratio: 16/7;}
.build-sec .build-card {padding: 16px;}
.build-sec .grid-box {gap: 8px;}
.build-para p{font-size: 16px;}
.build-sec .build-heading{margin-bottom: 16px;}
.possible-heading h2{margin-bottom: 30px;}
.tab-slider .owl-dot{height: 10px;width: 10px;}
.matter-sec .tag{margin-top: 24px;}
.owners-sec .choice-heading h4 {font-size: 14px;}
.footer-nav ul{flex-wrap: wrap;}
#faq_1 .accordion-button {   padding-right: 90px;  }
.render-sec .owl-carousel .owl-stage-outer .possible-img img {aspect-ratio: 1 / 1.03;}
.design-sec .design-main{padding: 32px 20px;}
.inner-header .logo a img{max-height: 20px;max-width: 95px;}
.post-card .post-details p{display: -webkit-box;-webkit-line-clamp: 10;-webkit-box-orient: vertical;overflow: hidden;}
.slider-handle {width: 7px;background-color: var(--white);}
.dream-details h1{font-size: 44px;line-height: 50px;text-transform: capitalize;margin-bottom: 24px;}
.post-card .post-details h1 {font-size: 22px;}
.banner-sec .detail-heading {flex-direction: column;}
.banner-sec .heading{width: 100%;}
.details-sec .banner-img img{aspect-ratio: 16 / 11.4;}
.q-card{border-radius: 14px;padding: 32px 21px;}


.q-card form textarea.form-control{height: 102px;}
.choose-box .text h4{font-size: 24px;line-height: 35px;}


}

@media (max-width:575px) {
h1 {font-size: 55px;Line-height: 100%;}
.hero-more-btn{flex-direction: column;justify-content: start;align-items: start;}
.hero-banner .hero-content p {font-size: 16px;line-height: 21px;}
.hero-more-btn li a{font-size: 12px;}
.remodel-card h5 {min-height: auto;}
.remodel-card p {font-size: 16px;}
.livo_sec .back-ground-white{padding: 24px 16px;}
.switch-tab{overflow-x: auto;scrollbar-width: none;}
.possible-sec ul.nav{flex-wrap: nowrap;white-space: nowrap;}
.possible-heading h2{margin-bottom: 24px;}
.possible-sec .possible-img img{aspect-ratio: 1/1;}
.matter-sec .main-box{padding: 24px 16px;}
.owners-sec .main-box{padding: 24px;}
.owners-sec .choice-text p{font-size: 14px;}
.testimonial-sec .owl-carousel .owl-stage-outer{overflow: visible;}
.testimonial-carousel .textimonial-item{opacity: 0;}
.testimonial-carousel .owl-item.active .textimonial-item{opacity: 1;}
.renovation-sec .main-box{padding: 52px 20px;}
.testimonial-carousel .owl-dots .owl-dot{width: 10px;height: 10px;}
.testimonial-carousel .owl-dots .owl-dot.active{height: 10px;}
.footer-nav ul{flex-wrap: wrap;flex-direction: column;justify-content: start;align-items: start;margin-top: 20px;}
footer hr{margin-top: 12px !important;}
footer .text-base p{text-align: start;}
.term-base a{width: 100%;}
footer .term-base{flex-direction: column;}
footer .text-base{margin-top: 24px;}
footer{padding: 45px 0 20px;}
.work_img img {aspect-ratio: 1 / 0.96;}
.work-main .work-content h2 {max-width: unset;}
.work_sec .work-main {padding: 20px;}
#faq_1 .accordion-button {padding-right: 50px;}
#faq_1 .accordion-button::after {width: 40px;}
.faq-sec .faq-block {padding: 32px 22px 12px;}
.faq-sec .faq-block h2 {margin-bottom: 18px;}
.design-sec .design-main .design-heading h2 {font-size: 39px;text-align: center;line-height: 45px;}
.post-card {padding: 16px;}
.post-card .post-img img ,.dream-sec .post-img img {border-radius: 24px;aspect-ratio: 16 / 11.2;}
.dream-card .dream-img {aspect-ratio: 16 / 10.8;}
.work_sec .work-heading h2 {margin-bottom: 24px;}




.recent-sec h2 {margin-bottom: 24px;}
.details-sec .deatils h2{margin: 60px 0 16px 0;}
.post-card .post-details h1 {font-size:18px;}
.hero-banner {min-height: 650px;padding-top: 124px;}
.slider-handle .drag-icon{width: 35px;left: -13px;}



}