maintenance of popup window with form

popup.js

    // maintenance of popup
  (function(){
      // open popup link   ***********************/
    var bopy = $('.bibop');
    $('#pop-js').on('click touchend', function(e) {
      bopy.css('display', 'block').show().animate({ opacity: 1 }, 350);
      e.preventDefault(); 
    });
  
    // popUp with form   ***********************/
    $('#blanket').on('click touchend', function() {
      bopy.animate({ opacity: 0 }, 350);
      setTimeout(function() {
        bopy.css('display', 'none');
      }, 350);
    });
    $('.close').on('click touchend', function() {
      bopy.animate({ opacity: 0 }, 350);
      setTimeout(function() {
        bopy.css('display', 'none');
      }, 350);
    });
  })();

popup.php

	<div id="blanket" class="bibop"></div>
    <div id="calPop" class="bibop">
        <div class="modal-form">
            <div class="modal-header">
                <button class="close" type="button">X</button>
                <h3><?php echo get_field('promo_pop_title'); ?></h3>
            </div>
            <div class="modal-body">
        <?php 
			$promo_form = get_field('promo_form');
			echo (do_shortcode("$promo_form")); 
		?>
            </div>
        </div>
	</div>

popup.scss

.bibop {display: none; opacity: 0;}

#blanket {
    position: fixed;
    z-index: 100;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba($color: #000000, $alpha: .5);
}

#calPop {
    display: none;
    position: fixed;
    z-index: 102;
    width: 300px;
    min-height: 300px;
    top: calc(50vh - 158px);
    left: calc(50% - 150px);
    box-sizing: border-box;
    border-radius: 4px;
    overflow: hidden;
    background-color: $col-white;
}

.modal-form {
    .modal-header {
        background: $col-red;
        text-align: center;
        min-height: 54px;
        padding: 15px 20px;
        margin-bottom: 25px;

        h3 {
            margin: 0;
            color: $col-white;
            font-size: type-scale(.3);
            font-weight: 300;
        }

        .close {
            display: block;
            float: right;
            color: $col-white;
            font-size: type-scale(.2);
            border: none;
            background-color: $col-red;
            transform: scaleX(1.5);
            cursor: pointer;

            &:focus {
                outline: none;
            }
        }
    }

    .modal-body {

        .wpcf7-form-control-wrap {
            display: block;
            text-align: center;
            margin-bottom: 8px;
                    
            input {
                padding: 12px;
                background: #e7e6e6;
                border: none;
                width: 80%;
                text-align: center;
                font-size: type-scale(0);
                color: #414141;

                &:focus {
                    outline: none;
                }
            }

            .olyajs {
                &:focus::-webkit-input-placeholder {
                    color: transparent
                }
                
                &:focus::-moz-placeholder {
                    color: transparent
                }
                
                &:focus:-moz-placeholder {
                    color: transparent
                }
                
                &:focus:-ms-input-placeholder {
                    color: transparent
                }
            }

        }

        .sub-form {

            input {
                display: block;
                width: 60%;
                margin: 20px auto 0;
                background:  $col-red;
                color: $col-white;
                padding: 6px 12px;
                border: 1px solid $col-red;
                font-size: type-scale(.4);
                @include transition();
    
                &:focus, &:active { outline: none; }
    
                &:hover {
                    background: $col-white;
                    border: 1px solid $col-red;
                    color: $col-red;
                    cursor: pointer;
                }
            }
        }
    }
}