Default style overrides for Bootstrap modals.

_modal.scss

.modal {
    z-index: 999999;
    .modal-header {
        position: relative;
    }
    .close {
        font-size: 2.6rem;

        width: 2.6rem;
        height: 2.6rem;

        opacity: 1;

        @include position(absolute, 1.4rem 1.4rem null null);
        &:hover .close-bar {
            background-color: #999;
        }
        .close-bar {
            display: block;

            width: 2.8rem;
            height: .2rem;

            background-color: #ccc;

            @include transition();
            &:first-of-type {
                @include transform(rotate(45deg));
                @include position(absolute, 1.5rem -.1rem null null);
            }
            &:last-of-type {
                @include transform(rotate(-45deg));
                @include position(absolute, 1.5rem -.1rem null null);
            }
        }
    }
}
.modal-dialog {
    width: auto;
    margin: 0;
}
.modal-content {
    border-radius: .3rem;
}
.modal-centred .modal-dialog {
    display: inline-block;

    width: auto;
    max-width: 100%;

    text-align: left;
    vertical-align: middle;
}
.modal-backdrop {
    z-index: 99999;
}

@media (min-width: 768px) {
    .modal.modal-centred {
        text-align: center;
        &:before {
            display: inline-block;

            height: 100%;

            content: '';
            vertical-align: middle;
        }
        .modal-dialog {
            width: 70rem;
            max-width: 100%;
        }
    }
}