/*!
* Visual Designer JQuery Plugin
* Author: Sam Zielke-Ryner
* Licensed under ...
*/

.vd-modal-widget {
    position: static !important;
    /* override .vd-release making this position: relative; */

    &.vd-modal-sml .modal-frame {
        width: 250px !important;
        text-align: center;
    }

    .vd-modal-open {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .vd-input-full {
        width: 100%;
    }

    .vd-close-button {
        position: absolute !important;
        right: 0px !important;
        top: 0px !important;
        width: 1.1em !important;
        height: 1.1em !important;
        cursor: pointer !important;
    }

    .vd-modal-close:after,
    .vd-modal-close:before {
        content: '';
        position: absolute;
        width: 2px;
        height: 1.5em;
        background: #ccc;
        display: block;
        transform: rotate(45deg);
        left: 50%;
        margin: -3px 0 0 -1px;
        top: 0;
    }

    .vd-modal-close:hover:after,
    .vd-modal-close:hover:before {
        background: #aaa;
    }

    .vd-modal-close:before {
        transform: rotate(-45deg);
    }

    .vd-close-modal {
        display: none !important;
    }
}

.vd-modal-widget .vd-open-modal:checked~.vd-modal-container {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.vd-modal-widget .vd-modal-container {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(2, 2, 2, .8);
    z-index: 150001;
}

.vd-modal-widget .vd-modal-container .vd-modal-frame {
    width: 50%;
    /*height:50%;*/

    background-color: #fff;
    border-radius: 1px;
    padding: 15px 30px;
    min-width: 500px !important;
    height: initial !important;
    text-align: center;
}

.vd-modal-widget .vd-modal-container .vd-modal-frame .vd-modal-header {
    text-align: center;
    position: relative;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;

    h3 {
        margin-bottom: 0px;
    }
}

.vd-modal-widget .vd-modal-container .vd-modal-frame .vd-modal-body {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}


.vd-modal-default {
    /*.pure-g >[class*="pure-u"] {
  margin: 10px 0;
}*/

    .vd-modal-container .vd-modal-frame {
        width: 550px;
    }

    .vd-row-widget {
        padding: 0;
    }

    input,
    textarea,
    select,
    option {
        border-radius: 1px !important;
    }

    label {
        margin-bottom: 5px !important;
    }

    .vd-submit-btn {
        text-align: center;
        margin-bottom: 0px !important;

        span {
            line-height: 25px;
            float: right;
            margin-left: 10px;
        }
    }

    .output {
        text-align: center;
        padding-top: 10px;

        span.error {
            color: red;
        }

        span.success {
            color: green;
        }
    }

    #vd-message {
        padding: 15px;
    }
}