@media (max-width: 1650px){
    .px-40{
        padding: 0px 20px;
    }
    .navbar .navbar-brand img{
        height: 22px;
    }
    .header-sec .search-input input{
        padding: 6px 34px 6px 16px;
        font-size: 18px;
        line-height: 26px;
        max-width: 250px;
    }
    .navbar ul.navbar-nav{
        gap: 20px;
    }
    .navbar ul.navbar-nav li a, .navbar ul li.dropdown a{
        font-size: 22px;
        font-weight: 400;
        line-height: 26px;
    }
    .header-sec .login-details a.btn-pink, .header-sec .login-details a.border-pink-btn{
        padding: 8px 18px;
        font-size: 18px;
        line-height: 24px !important;
    }
     .border-icon{
        height: 36px !important;
        width: 36px !important;
    }
    .border-icon img{
        height: 18px;
        width: 18px;
    }
    .menu-bar-icon ul.navbar-nav{
        gap: unset;
    }
    .location-icon-text{
        height: auto !important;
        width: auto !important; 
    }
}

@media (max-width: 1600px){
    .colorado-listing-sec{
        padding: 0px 30px 100px;
    }
    .footer-top-sec{
        padding: 0 60px;
    }
    .px-125{
        padding-right: 30px;
        padding-left: 30px;
    }
}
@media (max-width: 1365px){
    .navbar ul.navbar-nav li a, .navbar ul li.dropdown a{
        font-size: 20px;
        line-height: 22px;
    }
    .header-sec .search-input input{
        max-width: 200px;
    }
}

@media (max-width: 1200px){
    /* comaon */
    h1, .fs-121{
        font-size: 40px;
        line-height: 50px;
    }
    h2, .fs-36{
        font-size: 22px;
        line-height: 30px;
    }
    h3{
        font-size: 18px;
        line-height: 22px;
    }
    h4{
        font-size: 20px;
        line-height: 30px;
    }
    
    p, .fs-30{
        font-size: 18px;
        line-height: 28px;
    }
    .px-40{
        padding: 0px 20px;
    }
    .header-sec .mobile-none{
        display: none;
    }
    .header-sec .dropdown a.dropdown-toggle::after{
        height: 6px;
        width: 10px;
    }
    .navbar ul.navbar-nav li a, .navbar ul li.dropdown a{
        font-size: 20px;
        line-height: 20px;
    }
    .navbar .navbar-brand img{
        height: 21px;
    }
    
    .mobile-block{
        display: flex;
    }

     /* ---footer---- */
     .footer-sec .footer-box {
        /* background-color: var(--black); */
        border-radius: 20px;
        padding: 60px 40px 20px;
    }
    .footer-sec .heading-line h3 {
        font-size: 45px;
        line-height: 62px;
    }
    .btn-pink,.btn-border {
        font-size: 18px !important;
        line-height: 20px !important;
    }
    .login-with,.text-center {
		font-size: 18px !important;
        line-height: 20px !important;
	}
    .footer-sec .footer-menu a {
        font-size: 20px;
        line-height: 30px;
    }
    .footer-sec .footer-menu li {
        margin-bottom: 20px;
    }
    .footer-sec .center-part{
        justify-content: center !important;
        gap: 40px;
    }
    .footer-sec  .social-media img{
        width: 40px;
    }
    .footer-sec .copyright-line a {
        font-size: 18px;
        line-height: 22px;
    }
    .footer-sec .main-logo {
        width: 160px;
    }
    .footer-sec .newsletter-form input {
        font-size: 20px;
        line-height: 22px;
    }
    .footer-sec .copyright-line li {
        padding: 0 15px;
    }
    .footer-sec .post-btns {
        margin: 23px 0 80px;
    }
    .footer-sec .copyright-line {
        padding-top: 60px;
        gap: 10px;
    }
    .footer-sec {
        padding: 80px 20px 24px;
    }

    .footer-top-sec {
        padding: 0 40px;
        margin: 0 0px 0;
    }

    /* Hero Sec */
    .hero-content h1 img{
        height: 48px;
    }
    .search-icon img{
        height: 58px;
        width: 58px;
    
    }
    .location-sec{
        padding: 15px 12px 15px 32px;
    }
    .hero-sec{
        padding: 100px 20px 100px;
    }

    /* List page 2 */
    .location-info{
        gap: 18px;
    }
    .location-info .loc-icon img{
        height: 26px;
        width: 26px;
    }
    .fs-28{
        font-size: 20px;
        line-height: 32px;
    }
    .vip-info a{
        font-size: 16px;
        line-height: 20px;
    }
    .vip-info a img{
        width: 22px;
        height: 22px;
    }
    .colorado-listing-sec .listing-content .listing-info .mia-img{
        width: 320px;
    }
    .colorado-listing-sec .listing-content .listing-info .listing-detail{
        width: calc(100% - 320px);
        padding-left: 20px;
    }

    .filter-select-row .select-bar li a {
        padding-right: 20px;
        font-size: 20px;
    }
    .filter-select-row .select-bar{
        padding: 12px 18px;
    }
    .report-info p.text-black,
    .report-info p.text-black a{
        font-size: 16px;
    }
    .modal-last-btn{
        font-size: 15px;
        padding: 10px 12px;
        line-height: 18px !important;
    }
    
}

@media (max-width: 1024px){
    .inner-banner .filter-search {
        margin: 30px auto 50px;
        width: auto;
        gap: 20px;
    }
    .inner-banner .filter-search input {
        height: 50px;
        padding: 10px 20px;
        font-size: 18px;
        line-height: 22px;
    }
    .inner-banner .filter-search input::placeholder{
        font-size: 18px;
        line-height: 22px;
    }
    .inner-banner .filter-search .search-input::before {
        top: 16px;
    }
    .inner-banner .filter-btn{
        font-size: 18px;
        line-height: 22px;
        padding: 10px 20px;
    }
    .inner-banner .filter-btn img{
        width: 15px;
    }
    .inner-bg-img .first-img,
    .inner-bg-img .sec-img{
        height: 100%;
    }
    .inner-bg-img .sec-img {
        top: 10%;
    }
}

@media(max-width:991.98px){
    h1, .fs-121{
        font-size: 36px;
        line-height: 46px;
    }
    h2{
        font-size: 20px;
        line-height: 26px;
    }
    h3, h4{
        font-size: 16px;
        line-height: 20px;
    }
   
    p, .fs-30{
        font-size: 16px;
        line-height: 19px;
    }
    .fs-30{
        font-size: 18px;
        line-height: 24px;
    }
    .mx-40{
        margin-right: 20px;
        margin-left: 20px;
    }
    .px-40{
        padding: 0px 20px;
    }
    /* ====  Header =====  */
    .desktop-menu,
    .desktop-btn{
        display: none;
    }
    .desktop-btn{
        display: none !important;
    }
    .menu-bar-icon .border-icon{
        height: 36px;
        width: 36px;

    }
    .header-sec .navbar{
        padding: 14px 8px;
    }
/*    .mobile-block{
        display: flex;
    }*/
    /* ==== End Header =====  */
    /* ----footer--- */
    .footer-sec .heading-line p {
        font-size: 24px;
        line-height: 28px;
    }

    .btn-pink,.btn-border {
        font-size: 16px !important;
        line-height: 18px !important;
        padding: 10px 12px;
    }
    .login-with,.text-center {
		font-size: 16px !important;
        line-height: 18px !important;
	}
	
    .footer-sec .copyright-line a {
        font-size: 16px;
        line-height: 20px;
    }
    .footer-sec .copyright-line li {
        padding: 0 7px;
        display: flex;
        align-items: center;
    }
    .footer-sec .heading-line h3 {
        font-size: 34px;
        line-height: 50px;
    }
    .footer-sec .post-btns a {
        line-height: 15px !important;
    }
    .footer-sec .newsletter-form .input-group{
        height: 50px;
    }
    .footer-sec .newsletter-form input{
        font-size: 18px;
        line-height: 20px;
        height: 50px;
        padding: 10px 20px !important;
    }
    .footer-sec #basic-addon2 img{
        height: 30px;
        width: 30px;
    }
    .footer-top-sec h3 {
        padding: 30px 0 2px;
    }
    .footer-top-sec p{
        margin-bottom: 20px;
    }

    /* Hero-sec */
    .hero-sec{
        padding: 80px 20px 80px;
    }
    .location-sec .input-field input,
    .location-sec .input-field select,
    .hero-sec .select2-container .select2-selection--single .select2-selection__rendered,
    .location-sec .select2-container .select2-selection--single .select2-selection__rendered{
        font-size: 18px;
        line-height: 22px;
    }
    .colorado-listing-sec .listing-content .listing-info{
        align-items: start;
        padding: 35px 0px;
    }
    .colorado-listing-sec .listing-content .listing-info .mia-img{
        width: 150px;
    }
    .colorado-listing-sec .listing-content .listing-info .listing-detail{
        width: calc(100% - 150px);
    }

    /* List page 2 */
    .colorado-listing-sec{
        padding: 0px 30px 95px;
    }

    /* Filter popup */
    .filter-select-row .select-bar li a {
        font-size: 16px;
    }

    .login-details .login-btn{
        order: 1;
    }
    .login-details .user-btn{
        order: 2;
    }
    .login-details .post-search{
        order: 3;
    }
    .login-details .menu-bar-icon{
        order: 4;
    }
}



@media (max-width: 767.98px){
    
    h1, .fs-121{
        font-size: 34px;
        line-height: 51px;
    }
    h2{
        font-size: 17px;
        line-height: 25px;
    }
    h3, h4{
        font-size: 14px;
        line-height: 21px;
    }
   
    p, .fs-30{
        font-size: 16px;
        line-height: 18px;
    }
    .mb-40{
        margin-bottom: 24px;
    }
    /* ====  Header =====  */
    
    .header-sec .navbar{
        padding: 16px 8px;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 10px;
    
    }
    .sec-pad,
    .footer-sec {
        padding: 40px 8px;
    }
    
    .mb-30{
        margin-bottom: 24px;
    }
    .mx-40{
        margin-right: 15px;
        margin-left: 15px;
    }
    .px-40{
        padding: 0px 12px;
    }

    .btn-pink, .border-pink-btn, .border-btn{
        font-size: 15px;
        padding: 10px 12px;
        line-height: 18px !important;
    }

    /* Login Popup */
    .login-pop .modal-dialog .modal-content{
        padding: 25px 18px;
    }
    .login-pop .modal-dialog .modal-content h3{
        font-size: 17px;
    }
    .form-style input{
        border-radius: 50px;
        font-size: 15px;
        padding: 10px 12px;
        line-height: 18px !important;

    }
    .form-style .mb-18{
        margin-bottom: 10px;
    }
    .form-style .form-check label,
    .text-link{
        font-size: 12px;
        line-height: 14px;
    }
    .form-style .form-check input{
        width: 20px !important;
        height: 20px;
    }
    .form-style .form-check-input:checked[type=radio]{
        border: 4px solid #fff;
    }
    .login-pop .login-info .login-with{
        /*padding: 16px 0px;*/
    }
    .login-pop .social-icon ul{
        gap: 10px;
    }
    .login-pop .social-icon ul li a{
        height: 30px;
        width: 30px;
    }
    .login-pop .social-icon ul li a img{
        height: 14px;
        width: 14px;
        object-fit: contain;
    }
    .login-pop .login-info p.fs-22{
        font-size: 11px;
        line-height: 13px;
    }
    .login-pop .register-info p.fs-22{
        font-size: 13px;
        line-height: 15px;
    }
    .login-pop .login-info .mb-3{
        margin-bottom: 10px !important;
    }
    .login-pop .register-info{
        padding-top: 10px;
    }
    .login-pop .modal-dialog{
        padding: 30px;
    }
    /* ==== End Header =====  */
    /* ----footer--- */
    .footer-sec .heading-line p {
        font-size: 15px;
        line-height: 17px;
    }

    .btn-pink,.btn-border {
        font-size: 14px !important;
        line-height: 16px !important;
    }
    .login-with,.text-center {
		font-size: 14px !important;
        line-height: 16px !important;
	}
    .footer-sec .footer-menu a{
        font-size: 14px;
        line-height: 16px;
    }
    .footer-sec .footer-menu li{
        margin-bottom: 16px;
        line-height: 16px;
    }
    .footer-sec .copyright-line a {
        font-size: 13px;
        line-height: 15px;
    }
    .footer-sec .heading-line h3 {
        font-size: 22px;
        line-height: 33px;
    }
    .footer-sec .post-btns {
        margin: 10px 0 40px;
    }
    .footer-sec .footer-box {
        padding: 35px 20px 25px;
    }
    .footer-sec {
        padding: 56px 20px 24px;
    }
    .footer-sec .footer-part h4 {
        margin-bottom: 10px;
    }
    .footer-sec .footer-part {
        text-align: center;
    }
    .footer-sec .sec-row{
        gap: 35px;
    }
    .footer-sec .newsletter-form input {
        font-size: 14px;
        line-height: 16px;
        height: 40px !important;
        padding: 10px;
    }
    .footer-sec .newsletter-form .input-group {
        height: 40px !important;
    }
    .footer-sec .newsletter-form .input-group span img{
        width: 30px !important;
    }
    .footer-sec .newsletter-form .input-group span {
        padding-right: 8px;
    }
    .footer-sec .center-part {
        justify-content: space-between !important;
        gap: 40px;
        max-width: 220px;
        margin: 0 auto;
    }
    .footer-sec .social-media{
        justify-content: center;
    }
    .footer-sec .copyright-line {
        padding-top: 40px;
        justify-content: center !important;
        flex-direction: column;
        gap:10px;
    }
    .footer-sec .copyright-line p{
        order: 2;
        font-size: 13px;
        line-height: 15px;
    }
    .footer-sec .navbar-brand{
        order: 1;
    }
    .footer-sec .footer-last-menu{
        order: 3;
    }
    .footer-sec .newsletter-part,
    .footer-sec .social-part {
        max-width: 300px;
        margin: 0 auto !important;
    }
    
    /* footer-top-sec */
    .footer-top-sec{
        padding: 0 20px;
    }
    .footer-top-sec .icon-txt img {
        width: 30px;
        height: 30px;
        padding: 4px;
    }
    .footer-top-sec .icon-txt {
        gap: 9px;
        margin-bottom: 16px;
    }

    /* ==== Hero sec ===== */
    .location-sec{
        border: unset;
        padding: 0px 0px;
    }
    .hero-sec::before{
        width: 100%;
    }
    .location-sec .input-field {
        border: 1px solid var(--pink);
        padding: 5px 7px 5px 18px;
        border-radius: 100px;
        margin-bottom: 10px;
        min-height: 50px;
        justify-content: space-between;
    }
    .location-sec .input-field label{
        font-size: 13px;
        line-height: 15px;
    }
    .location-sec .input-field input,
    .location-sec .input-field select{
        font-size: 16px;
        line-height: 20px;
    }
    .search-icon img{
        height: 40px;
        width: 40px;
    }
    .hero-content h1 img{
        height: 29px;
    }
    .hero-sec{
        padding: 56px 34px 83px;
    }
    .hero-content .mx-630{
        margin: 0 auto 20px;
    }
    .hero-sec .select2-container--default .select2-selection--single::before,
    .location-sec .select2-container--default .select2-selection--single::before{
        height: 10px;
        width: 10px;
    }
    /* ==== End Hero sec ===== */
    .colorado-listing-sec .listing-content .listing-info .mia-img{
        width: 92px;
    }
    .colorado-listing-sec .listing-content .listing-info .listing-detail{
        width: calc(100% - 92px);
        padding-left: 15px;
    }
    
    .fs-36{
        font-size: 19px;
        line-height: 28px;
    }
    .vip-info{
        gap: 5px;
    }
    .vip-info a{
        font-size: 11px;
        line-height: 15px;
        padding: 4px 6px;
    }
    .vip-info a img{
        width: 15px;
        height: 15px;
    }
    .location-info .loc-icon img{
        height: 20px;
        width: 20px;
    }
    .fs-28{
        font-size: 15px;
        line-height: 18px;
    }
    .location-info{
        gap: 8px;
    }
    .colorado-listing-sec .mb-20{
        margin-bottom: 12px;
    }
    .colorado-listing-sec .listing-content .listing-info .mia-img img{
        height: 92px;
    }
    .d-m-none{
        display: none !important;
    }
    .d-m-block{
        display: block;
    }
    .colorado-listing-sec .list-des{
        margin-top: 10px;
    }
    .colorado-listing-sec .list-des p{
        font-size: 14px;
        line-height: 20px;
    }
    .location-sec .input-field input, .location-sec .input-field select, 
    .hero-sec .select2-container .select2-selection--single .select2-selection__rendered,
    .location-sec .select2-container .select2-selection--single .select2-selection__rendered{
        font-size: 16px;
        line-height: 18px;
    }

    /* inner banner */
    .inner-banner .filter-search{
        gap:10px;
    }
    .inner-banner .filter-search {
        margin: 24px auto 35px;
    }
    .inner-banner .filter-search input {
        height: 36px;
        padding: 8px 12px;
        font-size: 14px;
        line-height: 19px;
    }
    .inner-banner .filter-search input::placeholder{
        font-size: 14px;
        line-height: 19px;
    }
    .inner-banner .filter-btn{
        font-size: 14px;
        line-height: 16px;
        padding: 8px 12px;
    }
    .inner-banner .filter-search .search-input::before {
        top: 10px;
        right: 12px;
        width: 15px;
        height: 15px;
    }
    .inner-banner .filter-btn{
        padding: 3px 12px;
        width: 155px;
        justify-content: space-between;
    }
    .inner-banner .filter-search input{
        width: 155px;
    }
    .mobile-bg-img {
        width: 100%;
        position: absolute;
        z-index: -1;
    }
    .mobile-bg-img img{
        width: 100%;
    }

    .filter-modal .modal-dialog .modal-content {
        padding: 20px 18px;
    }
    .filter-select-row .select-bar li a {
        font-size: 15px;
    }
    .filter-select-row {
        row-gap: 16px;
        margin-top: 20px;
        flex-direction: column;
    }
    .filter-select-row .select-bar{
        width: 100%;
    }
    .filter-select-row .select-bar {
        padding: 9px 15px;
        height: 36px;
    }
    .filter-select-row .dropdown-toggle::before {
        top: 12px;
        right: 0;
        width: 10px;
        height: 10px;
    }
    .artical-img{
        width: 100%;
        position: absolute;
        z-index: -1;
    }
    .filter-modal .filter-btn{
        font-size: 18px;
        line-height: 22px;
    
    }
    .navbar .navbar-brand img{
        height: 16px;
    }
    .mobile-block{
        column-gap: 4px;
    }
}

@media(max-width: 380px){
    .navbar-brand{
        margin-right: 0 !important;
    }
    .navbar .navbar-brand img{
        height: 14px;
    }
    .header-sec .login-details{
        gap: 8px;
    }
}