.modal-header {
    background-image: linear-gradient(to right, #843fce, #346dd1);
    padding: 1rem 2rem;
}

div#standard-modal {
    padding-right: 0 !important;
}

.daterangepicker.show-calendar.opensright {
    margin-right: 6%;
}

body .daterangepicker.opensright:before,
body .daterangepicker.opensright:after {
    left: 50%;
    transform: translateX(-50%);
}

.modal-header h4 {
    color: #fff;
    font-size: 1.125rem;
}

.modal-header .close {
    color: #fff;
}

.modal .modal-body {
    padding: 2rem;
    padding-bottom: 0;
}

.modal .modal-footer {
    padding-right: 2rem;
    padding-bottom: 2rem;
}

.property-modal form .row {
    margin: 0;
    justify-content: space-between;
}

.modal form .row .form-group {
    width: 100%;
    max-width: 49%;
    position: relative;
    margin-bottom: 2rem;
}

.modal form .row .form-group.full-width-group {
    max-width: 100%;
}

.modal form .row .form-group.full-width-group .input-group-merge {
    max-width: 49%;
}

.modal label.error,
.modal label.is-invalid {
    position: absolute;
    /* left: 0px; */
    width: 100%;
    margin-top: 0.25rem;
    font-size: 0.75rem;
    bottom: -30px;
    color: rgb(248, 98, 98);
}

.modal .form-control.is-invalid {
    border-color: rgb(248, 98, 98);
}

.modal .bootstrap-select>.dropdown-toggle {
    height: 100%;
    border-radius: 0;
    border: medium none;
}

.modal .bootstrap-select.is-invalid {
    border-color: rgb(248, 98, 98);
}

.bootstrap-select.show .dropdown-menu.show {
    width: 100%;
}

.modal .bootstrap-select {
    border-radius: 0;
    border: 2px solid #ced4da;
    box-shadow: 1px 1px 6px #ccc !important;
}

.modal.lead-modal label.error,
.modal.lead-modal label.is-invalid {
    left: 15px;
}

.modal .form-control,
.modal .input-group-text {
    border-radius: 0;
    padding: .3rem .9rem;
    height: calc(2em + .9rem + 2px);
    border: 2px solid #ced4da;
    box-shadow: 1px 1px 6px #ccc !important;
}

.modal .btn-submit:hover,
.modal .btn-submit:active,
.modal .btn-submit:focus {
    color: #fff;
    background-color: #4938d7 !important;
    border-color: #3f2ed4 !important;
}

.modal-footer button.btn-primary:hover,
.modal-footer button.btn-primary:active,
.modal-footer button.btn-primary:focus {
    color: #fff;
    background-color: #4938d7 !important;
    border-color: #3f2ed4 !important;
}

.modal .form-control:hover,
.modal .form-control:active,
.modal .form-control:focus {
    box-shadow: 1px 1px 6px #ccc !important;
}

.modal .form-group span.required {
    display: inline-block;
    font-weight: 600;
    font-size: 18px;
    line-height: 18px;
    color: rgb(248, 98, 98);
}

.modal-footer button.btn {
    border-radius: 0;
    font-size: 20px;
    padding: .25rem 1rem;
    transition: all .3s;
    text-transform: capitalize;
    font-family: 'Muli', sans-serif;
}


/*Craiglist modal CSS Start*/

.instruction-list li {
    margin-bottom: 10px;
    position: relative;
    padding-left: 35px;
}

.instruction-list li i {
    margin-right: 8px;
    color: #346dd1;
    font-size: 22px;
    position: absolute;
    left: 0;
    top: -3px;
    ;
}

.modal.craiglist-modal form .row .form-group {
    max-width: 100%;
    margin-bottom: 2rem;
}

.modal.craiglist-modal .form-control {
    height: auto;
}

.modal.craiglist-modal .modal-footer {
    padding-bottom: 1rem;
}

form#createCategory .modal-body .col-md-12 {
    padding: 0;
}

form#createCategory .modal-body .col-md-12+.col-md-12 {
    margin-bottom: 0 !important;
}

div#createCategoryModal {
    padding-right: 0 !important;
}


/*Craiglist modal CSS End*/

@media screen and (min-width: 768px) {
    .modal-header {
        padding: 1rem 2rem;
    }
    .modal .modal-body {
        padding: 2rem;
        padding-bottom: 0;
    }
    .modal .modal-footer {
        padding-right: 2rem;
        padding-bottom: 2rem;
    }
}

@media screen and (max-width: 767px) {
    .modal form .row .form-group {
        max-width: 100%;
    }
    .modal form .row .form-group.full-width-group .input-group-merge {
        max-width: 100%;
    }
    .lead-modal.modal .modal-body {
        padding: 1rem;
        padding-bottom: 0;
    }
    .modal-header {
        padding: 1rem 1rem;
    }
}

.flash-animated {
    animation: flash 1s linear infinite;
}

@keyframes flash {
    0%,
    50%,
    100% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
}

.footer-modal.show .modal-header {
    background-image: linear-gradient( 120deg, #f65757 0%, #fe7777 100%) !important;
}

.footer-modal.show .modal-header i.flash-animated {
    color: #ffff !important;
    padding: 7px 10px;
}

.footer-modal .modal-header .close {
    opacity: 1;
}

.footer-modal.show .btn.btn-cancel {
    background-color: #336ed1;
    color: #fff;
    border: 2px solid #336ed1;
    border-radius: 0;
    font-size: 20px;
}

.footer-modal.show .modal-footer button.btn {
    background-color: #336ed1;
    color: #fff;
    border: 2px solid #336ed1;
    border-radius: 0;
    font-size: 20px;
}