ポップアップが開いたときにブラウザのスクロールバーを削除します（htmlおよびCSSのみ）

モーダルを開いても、作成したWebページはスクロール可能です。モーダルが開いているときにスクロールバーを無効にしようとしています。

html：

<div id="myModal" class="modalBack">
<div class="betaModal">
        <a href="#"><span><i class="fas fa-window-close"></i></span></a>
        <h4>Tell Me Something</h4>
        <label>Your Email:</label> <input type="Email" name="Email" placeholder="[email protected]"><br>
        <label>Subject:</label> <input type="text" name="title" ><br>
        <label>Message:</label> <input type="message-text" name="Message" placeholder="Write You Message Here ..."><br>
        <input type="submit" name="submit" value="Submit">
    </div>
<a href="#" class="bodyClose"></a>
    </div>

モーダルを切り替えるボタン：

<a href="#myModal"><button type="button" class="btn btn-light betaModelBtn">Contact Me</button></a>

CSS：

.modalBack {
	z-index: 10;
	position: absolute;
	height: 100vh;
	width: 100%;
	background-color: rgba(0,0,0,0.7);
	padding-top: 10%;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.5s;
}


.modalBack:target{
	opacity: 1;
	pointer-events: auto;
	position: fixed;
}