Quote Form
.overlay {
background: #000;
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
visibility: hidden;
opacity: 0;
transition: all 0.3s ease 0s;
}
.show-form .overlay {
visibility: visible;
opacity: 0.5;
}
.book-consultation-form {
background: #000;
position: fixed;
width: 100%;
height: 100%;
max-width: 600px;
right: -100%;
top: 0;
z-index: 999;
padding: 0;
transition: all 0.3s ease 0s;
}
.show-form .book-consultation-form {
right: 0;
}
/* Toggle Form */
$('.btn-inquire').click(function(ev){
ev.preventDefault();
$('body').toggleClass('show-form');
});
$('.overlay, .btn-close').click(function(ev){
ev.preventDefault();
$('body').removeClass('show-form');
});
<div class="btn-inquire">
<?php _e( 'Inquire Now', 'html5blank' ); ?>
</div>
<div class="book-consultation-form-wrap">
<div class="book-consultation-form">
<div class="btn-inquire">
<?php _e( 'Inquire Now', 'html5blank' ); ?>
</div>
<span class="btn-close"></span>
<?php if ( shortcode_exists( 'contact-form-7' ) ) {
echo do_shortcode('[contact-form-7 id="1"]');
} ?>
</div>
</div>
<div class="overlay"></div>