styles.scss

.modal-fb-download {
    position: fixed;
    display: flex;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    background-color: #00000087;
    overflow: hidden;
    overflow-y: auto;
    z-index: 1072;
    outline: 0;
    font-family: 'Segoe UI',Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif;

    .modal-content {
        height: 300px;
        min-width: 500px;
        margin: auto auto;
        background-color: #FFF;
        box-shadow: 1px 1px 10px 1px;
        border-radius: .25rem;
    }
    
    .modal-body {
        padding: 0 2rem 2rem;
    }
    
    .modal-header {
        display: flex;
        padding: 1rem 1.5rem
    }
    
    .close {
        margin: -1rem -1rem -1rem auto;
        cursor: pointer;
        background-color: transparent;
        border: 0;
        appearance: none;
        float: right;
        font-size: 1.5rem;
        font-weight: 700;
        line-height: 1;
        color: #000;
        text-shadow: 0 1px 0 #fff;
        opacity: .5;

        &:hover {
            opacity: .75;
        }
    }
    
    h2 {
        font-weight: normal;
        text-align: center;
    }
    
    .video-sources {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        padding-left: 0;
        margin-top: 0;
        margin-bottom: 0;
        list-style: none;
    }
    
    a {
        display: block;
        padding: .5rem 1rem;
        color: #007bff;
        text-decoration: none;
        background-color: transparent;

        &:hover {
            color: #0056b3;
            text-decoration: underline;
        }
    }
}