#vidTitle {
    font-family: 'Shadows Into Light', cursive;
    text-align: center;
    color: white;
    text-shadow: 2px 4px 6px black;
}

#popsVideo {
	max-width: 800px;
}

#newStream iframe {
	text-align: center;
}
/*#newStream {
    text-align: center;
    width: 80%;
    max-width: 800px;
    height: 0;
    padding-bottom: 56.25%;
}

#newStream video {
    position: absolute; top: 0; left:0;
    width: 80%;
    height: 80%;
    max-width: 800px;
}*/

#livestream,
.card {
    text-align: center;
}

body {
    background: radial-gradient(grey, #000)
}

.container {
    position: relative;
    z-index: 2
}

.card-img-top {
    width: 100%;
    height: 300px
}

.jumbotron {
    position: relative;
    overflow: hidden;
    margin-top: 30px
}

#fblike {
    margin-left: 30px;
}

#menu {
    padding: 8px;
    box-shadow: 4px 4px 8px gray
}

.navbar {
    opacity: .9
}

.card {
    box-shadow: 4px 4px 10px #000;
    text-shadow: 2px 2px 4px grey
}

.card img {
	width: 80%;
	box-shadow: 4px 6px 12px grey;
}

#livestream iframe,
.btn {
    box-shadow: 4px 4px 8px #000
}

.btn {
    text-shadow: 2px 2px 4px #000
}

#livestream iframe {
    color: #fff;
    border: none;
}

#streamTitle {
    color: #fff;
    text-shadow: 4px 4px 8px #000
}

@media (min-width:700px) {
    #video-background {
        position: absolute;
        height: auto;
        width: auto;
        min-height: 100%;
        min-width: 100%;
        left: 50%;
        top: 50%;
        -webkit-transform: translate3d(-50%, -50%, 0);
        transform: translate3d(-50%, -50%, 0);
        z-index: 1
    }
    #type,
    h1 {
        color: #fff
    }
    .lead {
        color: #d3d3d3
    }
}

@media (max-width:699px) and (min-width:250px) {
    .jumbotron {
        background-image: url(/images/sunset.jpg);
        background-size: cover;
        -moz-background-size: cover;
        -webkit-background-size: cover;
        -o-background-size: cover;
        text-align: center
    }
    #video-background {
        position: absolute;
        height: 1px;
        width: 1px;
        z-index: 0
    }
    #type,
    h1 {
        color: #fff
    }
    .navbar {
        width: 370px
    }
    #fblike {
        margin-left: 10px;
        width: 400px;
        height: 30px;
        border: none;
        overflow: hidden;
    }
    iframe {
        width: 400px;
        height: 100px
    }
}

@media (max-width:899px) and (min-width:300px) {
    .card {
        width: 300px
    }
    #popsVideo {
    	width: 325px;
    }
}

@media (max-width: 699px) {
    #livestream iframe {
        width: 350px;
        height: 400px;
    }
}