@media (min-width: 2560px){

    .card-container, .front, .back {

        height: 900px;

}

}

@media (min-width: 1701px){

    .hero-title h1 {

        font-size: 100px;

    }

    .hero-title h3 {

        font-size: 40px;

    }

    #hero_banner .ms_btn {

        font-size: 30px;

    }

    #hero_banner .ms_btn:focus, .ms_btn:hover{

        font-size: 30px;

    }

    .panel_content span {

        font-size: 16px;

    }

    .hero-title span {

        font-size: 25px;

    }

    .panel_content p {

        line-height: 30px;

    }

    .usp p {

        font-size: 22px;

    }

}

@media (min-width:1024px) {

     .hide-desktop{

        display:none

    }

}

@media (max-width:1700px) {

     .header-area .main-header-area,.header-area .main-header-area.sticky{

        padding:15px 115px

    }

     .container_80{

        max-width:85%;

        width:85%

    }

     .steps_panel p{

        width:65%

    }

     .card .stats-container ul li{

        font-size:17px!important

    }

     .slider_text h1 {

         font-size: 2.5em;

         width: 100%;

    }

     .slider_text h5 {

         margin: 0 auto;

         font-size: 1.75em;

         width: 80%;

    }

     .card-container, .front, .back {

         height: 715px;

    }

    .modal-dialog.modal-dialog-slideout { 

        min-height: 98%;

        margin-top: 5px !important;

    }



    .modal-dialog.modal-dialog-slideout .submit_form { 

        width: 55%; 

    }



    .modal-dialog-slideout .section_title h3 {

        font-size: 40px; 

    }



    .modal-dialog-slideout .section_title p { 

        width: 90%;

        padding:  0;

    }



    .modal-dialog-slideout .close {

        z-index: 999;

        top: 5px;

    }

}

@media (max-width:1500px) {

     .header-area .main-header-area.sticky{

        padding:10px 70px!important

    }

     .houzkey_logo_img{

        max-width:125px;

        margin-top:15px

    }

     .eric_desktop {

         bottom: 0;

         width: 230px;

         right: 35px;

         position: absolute;

    }

     .card .stats-container ul li{

        font-size:16px!important;

        margin:0 auto 7%!important

    }

     .card .stats-container{

        min-height:330px

    }

     .card-container, .front, .back {

         height: 700px;

    }



     .breaker_text .section_title {

         margin-bottom: 40px;

    }



    .breaker_text {

        padding-top: 115px; 

    }



    .breaker_text .section_title h3 { 

        margin-bottom: 0;

        padding-bottom: 0;

    }



    .breaker_text hr {

        margin: 10px auto 0px auto;

    }

    .learnmore_section {

        padding: 110px 0; 

    }





    .modal-dialog.modal-dialog-slideout {

        min-height: 78%;

        margin-top: 15px !important;

    }



    .modal-dialog-slideout { 

        width: 50%!important;

        max-width: 50%!important;

    }



    .modal-dialog-slideout .close {

        top: -5px;

    }



    .modal-dialog-slideout .submit_form {

        width: 55%;

    }



    .modal-dialog-slideout .section_title {

        margin-bottom: 10px; 

    }



    .modal-dialog-slideout .section_title h3 {

        font-size: 38px!important;

        margin: 0;

        line-height: 1.2;

    }



    .modal-dialog-slideout .section_title p {

        font-size: 18px;

        width: 100%;

        padding:  0;

    }



    .modal-dialog-slideout .modal-body {

        margin: 5px 0;

    }



    .terms_form {

        font-size: 10px;

    }

    .img-box img {

        max-height: 500px;

    }

}

@media (max-width:1366px) {

     .container_80{

        max-width:87%;

        width:90%

    }

     .header-area .log_chat_area .say_hi{

        font-size:20px;

        padding:12px 20px

    }

     .header-area .main-header-area.sticky{

        padding:10px 70px!important

    }

     .slider_text h1{

        font-size:2em;

        width:95%

    }

     .slider_description {

        width: 90%

    }

     .eric_desktop{

         bottom: 0% !important;

         width: 210px;

         right: 25px;

    }

     .icon img{

        max-width:45%

    }

     .card-container, .front, .back{

        height:680px!important

    }

     .section_title h3{

        font-size:43px!important

    }

     .registration_space .section_title p{

        font-size:17px;

        line-height:25px;

        margin-top:45px

    }

     .modal_form .touch_form .single_input label.radio-inline{

        width:20%

    }

     .card .stats-container{

        min-height:330px

    }

     .panel_content span {

         font-family: Gotham-Book;

         color: #7b7b7b;

         width: 90%;

         margin: 15px auto;

         display: block;

         font-size: 13px;

         min-height: 35px;

    }

     .slider_text h5 {

         font-size: 1.5em;

         width: 80%;

    }

     .steps_panel p {

         font-size: 15px;

         line-height: 18px;

         width: 75%;

         width: 70%;

    }

     .card .footer a {

         font-size: 17px;

    }

}

@media (max-width:1280px) {

     .panel_content span {

         width: 90%;

         font-size: 14px;

         min-height: 35px;

    }

     .panel_content h3 {

         font-size: 22px;

    }

     .card-container, .front, .back {

         height: 665px!important;

    }

     .back .header h3 {

         font-size: 20px;

    }

     .card .stats-container {

         min-height: 300px;

    }

     .card .stats-container ul li {

         font-size: 15px!important;

    }

    .type-fp {

        width: 40%;

    }

    .hero-title h1 {

        font-size: 60px;

    }

    .hero-title h3 {

        font-size: 25px;

    }

    .hero-title span {

        font-size: 15px;

    }

    #hero_banner .ms_btn{

        padding: 10px 13px;

    }

    .panel_content p {

        font-size: 15px;

    }

/*     .swiper1 .swiper-slide {

        height: 580px;

    } */

/*     .swiper2 .swiper-slide {

        height: 620px;

    } */

    .fpmodal .section_title h3 {

        font-size: 25px!important;

    }

    .img-box img {

        max-height: 500px;

        width: 100%;

    }

    .fpmodal .section_title.mb-50 {

        margin-bottom: 10px !important;

    }

    .fpmodal .modal-content{

        height: 80vh;

    }

    .fpmodal .modal-dialog {

        width: 80% !important;

    }

    .img-box img.centura-img {

        width: 100%;

        max-height: unset;

    }

}

@media only screen and (width: 1280px) and (min-height: 700px){



    #hero_banner {

        height: 97vh;

    }

}

@media (max-width:1200px) {

     .header-area .log_chat_area .say_hi{

        font-size:18px;

        padding:12px 20px;

        width:100%

    }

     .steps_panel p{

        font-size:16px;

        line-height:20px;

        width:70%

    }

     .card .stats-container ul li{

        font-size:15px!important

    }

    .modal-dialog-slideout .close {  

        z-index: 999;

    }

    .modal-dialog.modal-dialog-slideout .submit_form {

        width: 65%;

    }

}

@media (max-width:1024px) {

     .slider_area .ms_btn, .slider_area .ms_btn:hover, .slider_area .ms_btn:focus {

        font-size: 16px;

        width: 50%;

        background-color: #fff;

    text-decoration: none;

    }

     .masthead, .main-header-area.sticky .masthead {

         max-width: 200px;

    }

     .header-area .main-header-area.sticky{

        padding:10px 15px!important

    }

     .header-area .log_chat_area .say_hi{

        font-size:18px;

        padding:15px 20px

    }

     .slider_area .single_slider{

        height:90vh;

    }

     .icon img{

        max-width:55%

    }

     .steps_panel h6.first{

        left:25%

    }

     .steps_panel p{

        line-height:23px;

        width:90%;

        font-size:15px;

        text-align:center

    }

     .houzkey_logo_img{

        max-width:90px;

        margin-top:15px

    }

     .card-container, .front, .back {

         height: 725px!important;

    }

     .panel_content span {

         font-size: 13px;

    }

     .card .stats-container ul li{

        font-size:17px!important;

        margin:0 auto 7%!important

    }

     .card .stats-container {

         min-height: 340px;

    }

     .slider_text h1 {

         font-size: 1.75em;

         width: 100%;

    }

     .slider_text h5 {

         font-size: 1.35em;

         width: 100%;

    }

     .slider_text p {

         font-size: 13px !important;

         line-height: 20px;

         padding-top: 0;

         width: 100%;

         padding-top: 0 !important;

    }

     .header-area .ms_btn, .header-area .ms_btn:focus, .header-area .ms_btn:hover {

         font-size: 18px;

         text-align: center;

         margin-top: 0;

         padding: 12px 13px;

    }

     .learnmore_section {

         padding: 100px 0;

    }

     .learnmore_section h3 {

         font-size: 35px;

         line-height: 60px;

    }

     .eric_desktop {

         bottom: 0% !important;

         width: 210px;

         right: 10px;

    }



    .pt-custom {

        padding-top: 0;

    }



    .border-reg {

        display: none;

    }



    .sp-img {

        display: none;

    }

    .navbar-brand.font-tertiary.h3 {

        position: relative;

    }

    .ms_btn {

        width: 25%;

    }

    .type-fp {

        width: 50%;

    }

/*     .swiper-slide {

        height: 460px !important;

    } */

    .img-box img {

        width: 80%;

    }

    .hero-title h1 {

        font-size: 60px;

    }

    .hero-title h3 {

        font-size: 20px;

    }

    .hero-title span {

        font-size: 15px;

        margin-right: 1px;

    }



    .modal-dialog.modal-dialog-slideout {

        min-height: 78%;

        margin-top: 25px !important;

    }



    .modal-dialog-slideout { 

        width: 85%!important;

        max-width: 85%!important;

    }



    .modal-dialog-slideout .close {

        top: -5px;

    }



    .modal-dialog-slideout .submit_form {

        width: 55%;

    }



    .modal-dialog-slideout .section_title p {

        font-size: 18px; 

        width: 80%; 

    }



    .modal-dialog-slideout .modal-body {

        margin: 25px 0;

    }



}

@media only screen and (width: 1024px) and (height: 1366px) {

    .hero-title{

        text-align: center;

    }

    .ms_btn {

        width: 25%;

        margin: 0 auto;

    }

    #hero_banner{

        justify-content: center;

    }

    .hero-title h1 {

        font-size: 100px;

    }

    .hero-title h3 {

        font-size: 35px;

    }

    .hero-title span {

        font-size: 20px;

    }

    #hero_banner .ms_btn {

        width: 31%;

        font-size: 30px;

    }

}

@media (max-width:992px) {

    .eric_desktop {

         position: relative;

    }

     .filter-button {

         width: 24%;

    }

     .card.card-body {

         padding: 100px 0 0;

    }

     .hide-tablet{

        display:none

    }

     .header-area .main-header-area.sticky{

        transform:translateY(70px)

    }

     .slider_text h1{

         font-size: 2em;

         color: #ffffff;

         width: 80%;

    }

     .slider_text{

        margin-bottom:25%

    }

     .single_slider .ms_btn{

        font-size:18px;

        width:50%;

        text-align:center

    }

     .btn_bottom_hero{

        bottom:-75px;

        position:relative

    }

     .steps_panel p{

        line-height:19px;

        width:90%;

        font-size:15px

    }

     .steps_panel h6.first{

        left:18%

    }

     .section_title p{

        font-size:18px;

        line-height:28px;

        width:90%

    }

     .panel_content span{

        width:90%;

        font-size:15px;

        line-height:1.2;

         min-height: 60px;

    }

     .panel_content p strong{

        font-size:16px

    }

     .panel_content{

        min-height:345px

    }

     .floating_circle_right_bot{

        width:10%

    }

     .houzkey_logo_img{

        max-width:85px;

        margin-top:15px

    }

    .projects_moreinfo, .projects_moreinfo:hover, .projects_moreinfo:focus {

        /* padding: 10px 20px; */

        width: 100%;

    }

     .panel_content h3{

        font-size:19px

    }

     .eric_tsang_mobile{

        bottom:0;

        position:relative;

        width:60%;

        margin:0 auto -65px;

        text-align:center;

        display:block

    }

     .registration_image{

        width:100%!important;

        height:550px

    }

     .registration_space{

        width:100%!important

    }

     .registration_space .section_title p{

        font-size:17px;

        line-height:24px;

        margin-top:40px;

        width:90%

    }

     .modal_form{

        width:95%;

        margin:0 auto

    }

     .modal_form .touch_form .single_input label.radio-inline{

        width:35%

    }

     .card .header{

        padding:15px 10px 0

    }

     .back .header h3{

        font-size:20px

    }

     .card .content{

        padding:10px 0 20px

    }

     .card .stats-container ul li strong{

        font-size:20px

    }

     .front,.back,.card-container,.front,.back{

        height:665px!important

    }

     .card .stats-container ul li{

        font-size:16px!important

    }

     .card .stats-container{

        width:90%;

        min-height:325px;

        margin:25px auto 0

    }

     .card .footer a {

         width: 70%;

         font-size: 18px;

    }

     .width_sm_10{

        width:10%!important

    }

     .width_sm_20{

        width:20%!important

    }

     .width_sm_30{

        width:30%!important

    }

     .width_sm_40{

        width:40%!important

    }

     .width_sm_50{

        width:50%!important

    }

     .width_sm_60{

        width:60%!important

    }

     .width_sm_70{

        width:70%!important

    }

     .width_sm_80{

        width:80%!important

    }

     .width_sm_90{

        width:90%!important

    }

     .width_sm_100{

        width:100%!important

    }

     .learnmore_section .ms_btn, .learnmore_section .ms_btn:hover, .learnmore_section .ms_btn:focus {

         width: 100%;

         padding: 15px 30px;

    }

     .learnmore_section {

         padding: 110px 0;

         background-image: url(../img/q2/breaker_mobile.jpg);

         background-position: 0 35%;

    }

     .learnmore_section h3 {

         font-size: 28px;

         line-height: 1.25;

         width: 100%;

         margin: 0 auto;

    }

     .learnmore_section .ms_btn, .learnmore_section .ms_btn:hover, .learnmore_section .ms_btn:focus {

         width: 100%;

         padding: 13px 30px;

         font-size: 19px;

    }

     .breaker_text {

         padding-top: 100px;

    }

     .breaker_text .section_title {

         margin-bottom: 40px;

    }

     .projects_area {

         padding-top: 75px;

    }



    #loader {

        margin: -125px 0 0 -50px;

        width: 100px;

        height: 100px;

    }



    .slider_area .align-items-center{

        align-items: flex-start !important;

    }



    .comehome-img {

        padding-top: 25px;

        width: 45%;

    }



    .hoc-cb-img {

        width: 65%;

    }



    .breaker_text .section_title p {

        font-size: 16px;

        width: 100%;

    }



    .owl-carousel .owl-nav div.owl-next {

        left: auto;

        right: 0;

    }



    .owl-carousel .owl-nav .owl-prev{

        left: 0;

    }



    .owl-carousel .owl-item img.img-usp {

        width: 90%;

        margin: 0 auto;

    }



    .usp p {

        font-size: 16px;

        width: 100%;

         /*padding: 0 30px; */

        margin: 0 auto;

        left: 0;

    }



    .submit_form {

        width: 40%;

    }

    .footer-top .h5, .footer-top h5 {

        font-size: 15px;

    }

    p{

        font-size: 14px;

    }

    .line-top, .line-bottom {

        width: 100%;

        left: 0%;

    }

    #hero_banner {

        height: 80vh;

    }

    .slider_area.slider-thanks .align-items-center{

        align-items: center !important;

    }

    .ms_btn {

        width: 30%;

    }

/*     .swiper1 .swiper-slide{

        height: 474px !important;

    }

    .swiper2 .swiper-slide{

        height: 509px !important;

    } */

    .panel_content p {

        font-size: 14px;

    }  

    .hero-title h1 {

        font-size: 50px;

    }

    .hero-title h3 {

        font-size: 18px;

        padding: 5px 15px;

    }

    .hero-title span {

        font-size: 10px;

    }

    .ms_btn {

        font-size: 18px;

        width: 24%;

    }

    .ms_btn:hover {

        font-size: 18px;

        width: 24%;

    }

    #hero_banner .container_80.pt-5{

        padding-top: 10px !important ;

    }

    .modal-dialog.modal-dialog-slideout { 

        margin-top: 45px !important;

    }

}

@media only screen and (width: 768px) and (height: 1024px){

    .hero-title{

        display: block;

        text-align: center;

    }

    .ms_btn {

        display: none;

    }

    #hero_banner {

        background-image: url(../Assets/Hero_mobile2.jpg);

        justify-content: flex-start;

    }

    .hero-title h3 {

        font-size: 25px;

        padding: 0px;

    }

    .hero-title h1 {

        font-size: 65px

    }  

}

@media (max-width:480px) {

     .eric_desktop {

         bottom: 0px !important;

         width: 235px;

         right: auto;

         position: relative;

         text-align: center;

         margin: 0 auto;

    }

     .submit_btn .ms_btn {

         margin: 0 auto;

         width: 100%;

    }

     .hide-tablet{

        display:block

    }

    .hide-mobile{

        display: none;

    }

     .m_lr_15{

        margin-left:15px!important;

        margin-right:15px!important

    }

     .no_m_lr{

        margin-left:0!important;

        margin-right:0!important

    }

     .no_p_lr{

        padding-left:0!important;

        padding-right:0!important

    }

   /*   .header-area .main-header-area.sticky{

        top:-75px

    } */

     .slider_bg_1{

        background-image:url(../img/q2/hero_mobile-05.jpg)

    }

     .footer-social{

        -ms-flex-pack:center;

        justify-content:center;

        text-align:center

    }

     .slider_text h1{

        margin:0;

        font-size:1.35em;

        width:95%;

        color:#4a4a4a

    }

     .slider_text h5{

        margin:0 auto;

        font-size:1em;

        width:95%;

        color:#4a4a4a

    }

     .slider_text{

         margin-bottom: 45%;

         position: relative;

         top: 0px;

    }

     .slider_description {

        position: absolute;

        font-size:14px

    }

     .btn_bottom_hero{

        bottom:-80px;

        position:relative;

        margin:0 auto

    }

     .img_logo{

        max-width:100px;

        width:100%

    }

     .header-area .main-header-area .logo-img{

        width:80%

    }

     .masthead{

        max-width:90%

    }

     .single_slider .ms_btn{

        margin-top: 0;

        top: 15px !important;

        font-size:16px;

        color:#fff;

        position:relative;

        z-index:0;

        padding:8px;

        font-family:Gotham-Bold;

        background:#d0021b;

        border:1px solid #d0021b;

        width:50%;

        text-align:center;

        margin: 0 auto;

    }

     .header-area .main-header-area.sticky{

        padding:20px 10px

    }

     .main-header-area.sticky .masthead{

        max-width:95%

    }

     .section_title p{

        font-size:16px;

        line-height:1.3;

        width:100%

    }

     .icon img{

        max-width:65%;

        margin:0 auto 20px

    }

     .steps_panel h6{

        font-size:110px!important;

        left:25%;

        top:0

    }

     .steps_panel p {

         width: 80%;

         margin: 20px auto;

         text-align: center;

         font-size: 14px;

         line-height: 18px;

    }

     .m-w-70{

        width:70%

    }

     .m-text-center{

        text-align:center

    }

     .footer-top .h5,.footer-top h5{

        font-size:16px

    }

     .footer-bottom p{

        font-size:11px;

        text-align:center!important

    }

     .container_80{

        max-width:90%;

        width:90%;

        margin:0 auto

    }

     .floating_circle_left{

        width:15%;

        top:10%

    }

     .projects_area .single_service{

        width:90%

    }

     .m_xs_b0{

        margin-bottom:0!important

    }

     .panel_content{

        padding:30px 5px

    }

     .panel_content h3{

        font-size:20px

    }

     .panel_content span{

        width:95%;

         min-height: auto;

    }

     .floating_circle_right_bot{

        width:15%;

        bottom:10%

    }

     .get_in_tauch_area .touch_form .single_input label.radio-inline{

        width:30%

    }

     .get_in_tauch_area .touch_form .single_input input[type=radio]{

        width:15%;

        height:25px

    }

     .card.card-body{

        padding:50px 0 0;

        border-radius:0;

        background-image:url(../img/howitworks_mobile.jpg)

    }

     .steps_panel img{

        width:20%

    }

     .terms{

        width:80%;

        margin:0 auto;

        line-height:1.15

    }

     .panel_content{

        min-height:280px

    }

     .houzkey_logo_img{

        max-width:60px;

        margin-top:5px

    }

     .ribbon_projects{

        position:absolute;

        right:-1.75%;

        top:-6px;

        width:85px!important

    }

     .registration_image{

        width:100%!important;

        height:350px

    }

     .registration_space{

        width:100%!important

    }

     .registration_space .section_title p{

        font-size:17px;

        line-height:24px;

        margin-top:40px;

        width:90%

    }

     .modal_form{

        width:95%;

        margin:0 auto

    }

     .modal_form .touch_form .single_input label.radio-inline{

        width:35%

    }

     .width_xs_10{

        width:10%!important

    }

     .width_xs_20{

        width:20%!important

    }

     .width_xs_30{

        width:30%!important

    }

     .width_xs_40{

        width:40%!important

    }

     .width_xs_50{

        width:50%!important

    }

     .width_xs_60{

        width:60%!important

    }

     .width_xs_70{

        width:70%!important

    }

     .width_xs_80{

        width:80%!important

    }

     .width_xs_90{

        width:90%!important

    }

     .width_xs_100{

        width:100%!important

    }

     .m_xs_0{

        margin:0!important

    }

     .mt_xs_0{

        margin-top:0!important

    }

     .mt_xs_10{

        margin-top:10px!important

    }

     .mt_xs_20{

        margin-top:20px!important

    }

     .mt_xs_30{

        margin-top:30px!important

    }

     .mt_xs_40{

        margin-top:40px!important

    }

     .mt_xs_50{

        margin-top:50px!important

    }

     .mb_xs_0{

        margin-bottom:0!important

    }

     .mb_xs_10{

        margin-bottom:10px!important

    }

     .mb_xs_20{

        margin-bottom:20px!important

    }

     .mb_xs_30{

        margin-bottom:30px!important

    }

     .mb_xs_40{

        margin-bottom:40px!important

    }

     .mb_xs_50{

        margin-bottom:50px!important

    }

     .eric_tsang_mobile{

        bottom:0;

        position:relative;

        width:60%;

        margin:50px auto -20px;

        text-align:center;

        display:block

    }

     .card .stats-container ul li strong{

        font-size:20px!important;

        line-height:1.5

    }

     .card .stats-container ul{

        width:95%;

        margin:0 auto 5%

    }

     .front,.back{

        height:100%

    }

     .card .content{

        padding:10px 0!important

    }

     .content .ms_btn{

        position:relative;

        bottom:-5px

    }

     .front,.back{

        height:620px!important

    }

     .card .stats-container{

        width:90%!important;

        margin:20px auto;

        min-height:275px

    }

     .section_title h3{

        font-size: 26px!important;

        width: 90%;

        margin: 0 auto 10px auto;

        line-height: 1.25;

    }

     .back .header h3{

        font-size:21px!important

    }

     .card .header{

        padding:20px 0

    }

     .card-container,.front,.back{

        height:670px!important

    }

     .card .header h3{

        margin-top:25px!important

    }

     .card .stats-container ul li{

         font-size: 15px!important;

         margin: 0 auto 5%!important;

    }

     .modal-dialog-slideout {

         width: 85%!important;

         max-width: 85%;

    }

     .modal-dialog-slideout .close {

         font-size: 2rem;

    }

     .vt_tour_content .ms_btn {

         display: block;

         width: 100%;

         margin: 0 auto 25px auto;

         font-size: 17px;

    }

     .filter-button, .filter-button.active {

         margin-top: 15px;

         width: 45%;

         font-size: 14px;

         margin-bottom: 0px;

    }

     .slider_text p {

         font-size: 11px !important;

         padding-top: 15px !important;

         line-height: 15px !important;

    }

     .thankyou_text {

         font-size: 2em;

    }

     .terms_form {

         font-size: 10px;

         font-family: Gotham-Medium;

    }

     .terms_form input{

         margin-right: 5px !important;

    }

     .houzkey_logo_img {

         max-width: 90px;

         margin-top: 5px;

         right: 5px;

         bottom: 5px;

    }

     .breaker_text .section_title h3 strong {

         display: block;

    }

     .breaker_text .section_title h3 {

         font-size: 28px!important;

         line-height: 32px;

         margin-bottom: 25px !important;

    }

     .breaker_text .section_title {

         margin-bottom: 15px;

    }

     .projects_area {

         padding-top: 50px;

    }

     .breaker_text {

         padding-top: 75px;

    }

    .listing-header{

        background-image: url("../img/q2/breaker_mobile.jpg");

    }

    .navbar-brand.font-tertiary.h3 {

        position: relative;

        padding: 0px;

        margin: 0px;

    }

    .projects_moreinfo, .projects_moreinfo:hover, .projects_moreinfo:focus {

        width: 100%;

    }

    .submit_form {

        width: 90%;

    }

    .img-box img {

        width: 65%;

    }

    .img-box{

        text-align: center;

    }

    .type-fp{

        margin: 0 auto;

    }

    .usp p {

        width: 60%;

        font-size: 20px;

    }

    .text-black {

        width: 80%;

        margin: 0 auto;

    }

    #hero_banner {

        background-image: url(../Assets/Hero_mobile.png);

        height: 640px;

        justify-content: flex-start;

    }

    .ms_btn{

        display: none;

    }

    .hero-title{

        text-align: center;

    }

    .container.pt-5{

        padding-top: 7px !important;

    }

    .hero-title h1 {

        font-size: 40px;

        padding-top: 20px;

    }

    .hero-title h3 {

        font-size: 20px;

        padding: 5px 15px;

        margin: 0 auto;

    }

    .hero-title span {

        font-size: 11px;

        margin-right: 2px;

    }

    .owl-carousel .owl-item img.img-usp {

        width: 35%;

    }



    .swiper-pagination{

        display: block;

    }

    .slider_bg_1 {

        background-image: url(../Assets/Hero_mobile.jpg);

    }

    .slider_text.thankyou_text h1{

        color: white;

    }

    .container_80{

        padding: 50px 0;

    }

    .swiper-container{

        background-color: white !important;

    }

/*     .swiper1 .slide-box, .swiper2 .slide-box {

        padding: 0px 30px 50px 30px;

    } */

    .img-box img {

        width: 100%;

        padding-top: 0px;

    }

    .slide-box.centura-box{

        padding: 18px;

    }

    .centura-img{

        max-width: 100% !important;

    }

    #hero_banner .container_80.pt-5{

        padding: 10px 0 !important;

    }

    .projects_area {

        padding-top: 0px;

   }

   p {

    font-size: 15px;

    }

    .panel_content p strong {

        font-size: 18px;

    }

    .slide-box{

        display: flex;

        flex-direction: column;

        align-items: center;

        justify-content: center;

    }

    .type-fp {

        width: 80%;

        padding: 7px 0px;

    }

    .swiper1 .swiper-slide, .swiper2 .swiper-slide{

        height: 100% !important;

        padding-top: 15px;

    }

    .modal-dialog-slideout {

         width: 85%!important;

         max-width: 85%;

    }

     .modal-dialog-slideout .close {

         font-size: 2rem;

    }



    .modal-dialog.modal-dialog-slideout { 

        width: 95%!important;

        max-width: 95% !important;

    }



    .modal-dialog.modal-dialog-slideout .submit_form {

        width: 100%;

    }



    .modal-dialog-slideout .get_in_tauch_area {

        padding: 0px !important;

        width: 85%;

        margin: 0 auto;

        display: block;

    }



    .modal-dialog-slideout .section_title {

        margin-bottom: 10px;

    }



    .modal-dialog-slideout .section_title p {

        font-size: 15px;

        padding: 0;

        line-height: 1.3;

        width: 100%;

    }



    .modal-dialog-slideout .get_in_tauch_area .touch_form .single_input input, 

    .modal-dialog-slideout .get_in_tauch_area .touch_form .single_input select, 

    .modal-dialog-slideout .get_in_tauch_area .touch_form .single_input textarea {

        height: 40px;

        padding: 0px;

        font-size: 16px; 

    }



    .modal-dialog-slideout .close { 

        top: -1%;

    }



    .modal-dialog.modal-dialog-slideout {

        min-height: auto;

        margin-top: 15px !important;

        height: 645px;

    }



    ::-moz-selection{background:#444;color:#fff;text-shadow:none;background:#444;color:#fff;text-shadow:none}

    ::selection{background:#444;color:#fff;text-shadow:none}

    ::-webkit-input-placeholder{color:#ccc;font-size:12px;opacity:1}

    :-ms-input-placeholder{color:#ccc;font-size:12px;opacity:1}

    ::-ms-input-placeholder{color:#ccc;font-size:12px;opacity:1}

    ::placeholder{color:#ccc;font-size:12px;opacity:1}



    #register_popup {

        overflow-y: scroll;

    }

    .modal-dialog-slideout .section_title h3 {

        font-size: 32px!important;

        margin: 0 0 10px 0; 

        color: #d0021b !important;

    }

    .fpmodal .modal-dialog {

        width: 95% !important;

/*         margin: 0 auto; */

    }

    .fpmodal .modal-content{

        height: auto;

    }

    .img-box img {

        max-height: 400px;

        width: 100%;

    }

    .swiper-button-next{

        right: 10% !important;

        top: 30% !important;

    }

    .swiper-button-prev {

        left: 10% !important;

        top: 30% !important;

    }

    .swiper-pagination{

        display: none !important;

    }

}

@media (max-width:320px) {

     .slider_text h1 {

         font-size: 1.2em;

    }

     .icon img {

         max-width: 60%;

    }

     .header-area .ms_btn, .header-area .ms_btn:focus, .header-area .ms_btn:hover {

         font-size: 13px;

    }

     .btn_bottom_hero{

        bottom:-55px

    }

     .section_title p{

        font-size:16px;

        line-height:22px;

        margin-top:30px

    }

     .ms_btn,.ms_btn:focus,.ms_btn:hover{

        font-size:18px;

        padding:10px 25px

    }

     .btn_howitworks::after{

        font-size:30px

    }

     .projects_area .single_service{

        width:100%

    }

     .panel_content p strong{

        font-size:15px

    }

     .panel_content p{

        font-size:14px

    }

     .panel_content span{

        font-size:14px

    }

     .panel_content h3{

        font-size:18px

    }

     .section_title h3{

        font-size:25px;

        line-height:1.15

    }

     .section_title h3:before{

        bottom:-5px

    }

     .houzkey_logo_img{

        max-width:45px;

        margin-top:0

    }

     .steps_panel p{

        width:75%

    }

     .card .stats-container ul li{

        font-size:15px!important

    }

     .card .header{

        padding:20px 0 0

    }

     .card .stats-container ul li strong{

        font-size:20px!important

    }

     .back .header h3{

        font-size:18px

    }

     .card .stats-container ul li.buildsize_icon,.card .stats-container ul li.room_icon,.card .stats-container ul li.fac_icon,.card .stats-container ul li.others_icon,.card .stats-container ul li.repayment_icon{

        padding-left:40px!important

    }

     .card-container, .front, .back{

        height:650px!important

    }

     .thankyou_text {

         font-size: 1.2em;

    }

    .projects_moreinfo {

        font-size: 14px;

    }

    .panel_content p {

        font-size: 12px;

    }

    .card .footer a {

        width: 70% !important;

    }

}