a, a:focus, a:hover {
    color: #fff;
    text-decoration: none
}

.btn-default {
    color: #fff;
    text-shadow: none;
    background-color: transparent;
    border: 2px solid #fff;
    border-radius: 20px;
    padding: .5rem 2rem
}

    .btn-default:hover, .btn-default:focus {
        background-color: rgba(255,255,255,.3)
    }

html, body {
    height: 100%
}

body {
    background: url(../img/cover.jpg) no-repeat center center fixed;
    background-size: cover;
    color: #fff;
    text-align: center;
    font-family: quicksand,sans-serif
}

#backgroundVideo {
    -o-object-fit: cover;
    object-fit: cover;
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0
}

.site-wrapper {
    position: relative;
    height: 100vh;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    display: table;
    width: 100%;
    height: 100%;
    min-height: 100%;
    background: rgba(48,53,70,.5);
    box-shadow: inset 0 0 100px rgba(0,0,0,.5)
}

.site-wrapper-inner {
    display: table-cell;
    vertical-align: top
}

.cover-container {
    margin-right: auto;
    margin-left: auto
}

.inner {
    padding: 30px
}

.masthead-brand {
    margin-top: 10px;
    margin-bottom: 10px
}

.nav-masthead {
    text-align: center;
    display: block
}

    .nav-masthead .nav-link {
        display: inline-block
    }

@media(min-width:768px) {
    .masthead-brand {
        float: left
    }

    .nav-masthead {
        float: right
    }
}

.cover {
    padding: 0 20px
}

    .cover .btn-notify {
        padding: 10px 60px;
        font-weight: 500;
        text-transform: uppercase;
        border-radius: 40px
    }

.cover-heading {
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 10px;
    font-size: 2.5rem;
    margin-bottom: 2rem
}

.cover-copy {
    max-width: 500px;
    font-size: 1rem;
    margin: 0 auto 3rem
}

@media(min-width:768px) {
    .cover-heading {
        font-size: 3.4rem;
        letter-spacing: 15px
    }

    .cover-copy {
        font-size: 1.25rem
    }
}

.mastfoot {
    color: #999;
    color: rgba(255,255,255,.5)
}

#timer {
    min-height: 150px
}

    #timer div {
        display: inline-block;
        line-height: 1;
        text-align: center;
        padding: 20px 10px;
        min-height: 80px;
        width: 80px;
        margin-bottom: 1rem
    }

    #timer span {
        display: block;
        margin-top: .6rem;
        font-size: .8rem;
        text-transform: uppercase;
        text-align: center;
        letter-spacing: .6px
    }

#days {
    font-size: 2rem
}

#hours {
    font-size: 2rem
}

#minutes {
    font-size: 2rem
}

#seconds {
    font-size: 1.5rem
}

@media(min-width:768px) {
    #timer {
        min-height: 200px
    }

        #timer div {
            padding: 20px;
            min-height: 100px;
            width: 120px;
            margin-bottom: 3rem
        }

    #days {
        font-size: 5rem
    }

    #hours {
        font-size: 5rem
    }

    #minutes {
        font-size: 5rem
    }

    #seconds {
        font-size: 3rem
    }
}

@media(min-width:768px) {
    .masthead {
        position: fixed;
        top: 0
    }

    .mastfoot {
        position: fixed;
        bottom: 0
    }

    .site-wrapper-inner {
        vertical-align: middle
    }

    .masthead, .mastfoot, .cover-container {
        width: 100%
    }
}

@media(min-width:992px) {
    .masthead, .mastfoot, .cover-container {
        width: 1060px
    }
}
