<div class="bp-modal modal micromodal-slide" id="modal-register" aria-hidden="true">
    <div class="modal__overlay" tabindex="-1" data-micromodal-close>
        <div class="modal__overlay__inner" tabindex="-1" data-micromodal-close>
            <button class="modal__close" aria-label="Close modal" data-micromodal-close></button>
            <div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="modal-1-title">
                <header class="modal__header">
                    <h2 class="modal__title" id="modal-register-title">
                        Register
                    </h2>
                </header>
                <main class="modal__content" id="modal-register-content">
                    <form action="#" class="bp-from register">
                        <div class="bp-form-group bp-form-group_errors">
                            <div class="bp-form-group__inner">
                                <span class="bp-form-error">Поле password обязательно к заполнению</span>
                            </div>
                        </div>
                        <div class="bp-form-group">
                            <div class="bp-form-group__inner">
                                <input type="text" placeholder="First name" class="bp-form-control" name="firstName" id="registerFirstName">
                                <span class="bp-form-error hidden">Поле обязательно к заполнению</span>
                            </div>
                        </div>
                        <div class="bp-form-group">
                            <div class="bp-form-group__inner">
                                <input type="text" placeholder="Last name" class="bp-form-control" name="lastName" id="registerLastName">
                                <span class="bp-form-error hidden">Поле обязательно к заполнению</span>
                            </div>
                        </div>
                        <div class="bp-form-group">
                            <div class="bp-form-group__inner">
                                <input type="text" placeholder="Email" class="bp-form-control" name="email" id="registerEmail">
                                <span class="bp-form-error hidden">Email не валиден</span>
                            </div>
                        </div>
                        <div class="bp-form-group">
                            <div class="bp-form-group__inner">
                                <input type="password" placeholder="Password" class="bp-form-control" name="password" id="registerPassword">
                            </div>
                        </div>
                        <div class="bp-form-group">
                            <button id="sendRegister" type="submit" class="bp-btn bp-btn-black">Register</button>
                        </div>
                    </form>
                </main>
                <footer class="modal__footer"></footer>
            </div>
        </div>
    </div>
</div>

<div class="bp-modal modal micromodal-slide" id="modal-login" aria-hidden="false">
    <div class="modal__overlay" tabindex="-1" data-micromodal-close>
        <div class="modal__overlay__inner" tabindex="-1" data-micromodal-close>
            <button class="modal__close" aria-label="Close modal" data-micromodal-close></button>
            <div class="modal__container" role="login" aria-modal="true" aria-labelledby="modal-1-title">
                <header class="modal__header">
                    <h2 class="modal__title" id="modal-login-title">
                        login
                    </h2>
                </header>
                <main class="modal__content" id="modal-login-content">
                    <div class="errors-group bp-text-red">
                        <p>error message</p>
                    </div>
                    <form action="#" class="bp-from bp-login">
                        <div class="bp-form-group">
                            <div class="bp-form-group__inner">
                                <input type="text" placeholder="Email" class="bp-form-control" name="email" id="loginEmail">
                            </div>
                        </div>
                        <div class="bp-form-group">
                            <div class="bp-form-group__inner">
                                <input type="password" placeholder="Password" class="bp-form-control" name="password" id="loginPassword">
                            </div>
                        </div>
                        <div class="bp-form-group bp-form-check">
                            <input class="bp-form-check-input" id="remember-my" type="checkbox">
                            <label class="bp-form-check-label" for="remember-my">Remember me</label>
                        </div>
                        <div class="bp-form-group">
                            <button id="sendLogin" type="submit" class="bp-btn bp-btn-black">Login</button>
                        </div>
                    </form>
                </main>
                <footer class="modal__footer">
                    <div class="modal_links bp-d-flex bp-f-center bp-f-wrap">
                        <a class="modal_links__item" href="#">Forgot your password?</a>
                        <a class="modal_links__item" href="#">Not registered? Click here</a>
                    </div>
                </footer>
            </div>
        </div>
    </div>
</div>
<div class="bp-modal modal micromodal-slide top-content-modal modal-max-width" id="modal-search" aria-hidden="true">
    <div class="modal__overlay" tabindex="-1" data-micromodal-close>
        <div class="modal__overlay__inner" tabindex="-1" data-micromodal-close>
            <button class="modal__close" aria-label="Close modal" data-micromodal-close></button>
            <div class="modal__container">
                <header class="modal__header">
                    <h2 class="modal__title modal__title_without-logo" id="modal-search-title">
                        Search
                    </h2>
                </header>
                <main class="modal__content" id="modal-search-content">
                    <div class="errors-group bp-text-red hidden"></div>
                    <form id="searchSection" action="#" class="bp-from bp-search">
                        <div class="bp-form-group">
                            <div class="bp-form-group__inner bp-form-group__inner-search">
                                <input type="text" required placeholder="Search" class="bp-form-control" name="s" id="s">
                                <span class="bp-form-error hidden"></span>
                                <button id="sendSearch" type="submit" class="bp-btn bp-btn-search bp-form-control__inline-btn"></button>
                            </div>
                        </div>
                    </form>
                </main>
                <footer class="modal__footer"></footer>
            </div>
        </div>
    </div>
</div>
<div class="bp-modal modal micromodal-slide" id="modal-profile" aria-hidden="true">
    <div class="modal__overlay" tabindex="-1" data-micromodal-close>
        <div class="modal__overlay__inner" tabindex="-1" data-micromodal-close>
            <button class="modal__close" aria-label="Close modal" data-micromodal-close></button>
            <div class="modal__container" role="login" aria-modal="true" aria-labelledby="modal-1-title">
                <header class="modal__header">
                    <h2 class="modal__title" id="modal-profile-title">
                        Profile
                    </h2>
                </header>
                <main class="modal__content" id="modal-profile-content">
                    <form action="#" class="bp-from bp-login">
                        <div class="bp-form-group">
                            <div class="bp-form-group__inner">
                                <input type="text" placeholder="First name" class="bp-form-control" name="firstName" id="firstName">
                            </div>
                        </div>
                        <div class="bp-form-group">
                            <div class="bp-form-group__inner">
                                <input type="text" placeholder="Last name" class="bp-form-control" name="lastName" id="lastName">
                            </div>
                        </div>
                        <div class="bp-form-group">
                            <div class="bp-form-group__inner">
                                <input type="text" placeholder="Email" class="bp-form-control" name="email" id="email">
                            </div>
                        </div>
                    </form>
                </main>
                <footer class="modal__footer">
                    <div class="modal_links bp-d-flex bp-f-center bp-f-wrap">
                        <a class="modal_links__item" href="#">Forgot your password?</a>
                        <a class="modal_links__item" href="#">Not registered? Click here</a>
                    </div>
                </footer>
            </div>
        </div>
    </div>
</div>

<div class="bp-modal modal micromodal-slide" id="modal-bid" aria-hidden="true">
    <div class="modal__overlay" tabindex="-1" data-micromodal-close>
        <div class="modal__overlay__inner" tabindex="-1" data-micromodal-close>
            <button class="modal__close" aria-label="Close modal" data-micromodal-close></button>
            <div class="modal__container" role="login" aria-modal="true" aria-labelledby="modal-1-title">
                <header class="modal__header">
                    <h2 class="modal__title modal__title_without-logo" id="modal-bid-title">
                        Your bid:
                    </h2>
                </header>
                <main id="modal-bid-content" class="modal__content bp-mb-30">
                    <p class="modal__content__item bp-d-flex"><strong>Lot number:</strong>&nbsp;<span>2</span></p>
                    <p class="modal__content__item bp-d-flex"><strong>Lot name:</strong>&nbsp;<span>Sigal Tsabari , b. 1966 - Untitled, 1991 Artist's name: Sigal Tsabari , b. 1966 ...</span></p>
                    <p class="modal__content__item bp-d-flex"><strong>Your max absentee bid:</strong>&nbsp;<span class="bp-text-red">$2,600</span></p>
                </main>
                <footer class="modal__footer bp-d-flex">
                    <div class="bp-d-flex bp-f-center bp-mr-auto">
                        <a target="_blank" class="bp-btn bp-btn-default bp-btn-link" href="#">Terms of sale</a>
                    </div>
                    <div class="bp-d-flex bp-f-center">
                        <a id="dontAgreeBid" class="bp-btn bp-btn-primal bp-btn-link" href="#">I don't Agree</a>
                        <a id="agreeBid" class="bp-btn bp-btn-primal" href="#">I Agree</a>
                    </div>
                </footer>
            </div>
        </div>
    </div>
</div>