#mainContent .modal-dialog-scrollable {
    width: 60%;
    margin: 5% auto;

}
#mainContent{
    min-height:80vh;
}
@media only screen and (max-width: 500px) {
    .forms-area ul {
        position: relative !important;
        top: 0 !important;
        right: 0 !important;
    }

    .forms-area .fa-circle-xmark {
        display: none;
    }

    #mainContent .modal-dialog-scrollable {
        width: 100%;
        margin: 0;
    }

    .modal-dialog-scrollable .modal-content {
        height: 100vh;
    }

    .forms-area {
        position: relative !important;
    }
}
@media (min-width:500px) and (max-width:1124px) {
    #mainContent .modal-dialog-scrollable {
        width: 95%;
    }
}