@charset "UTF-8";
/* CSS Document */

body {
font-family: 100%/1.4 'Roboto', sans-serif;
letter-spacing: 1px;
 width: 100%;
  margin: 0;
  background: #000; 
}

main {
	background: rgba(0,0,0,0.2);
	background-size:cover;
}

video#bgvid { 
    position: fixed;
	display: block;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
 background: url(images/SF4.jpg) no-repeat;
  background-size: cover;
  transition: 1s opacity;
  opacity: 0.7;
}
.stopfade { 
   opacity: .5;
}

header {
	width: 100%;
	height: auto;
}

hr {
	color: #FFF;
	border-width: 1px;
}


@media screen and (max-width: 480px) { 
 html { background: url(images/SF4.jpg) no-repeat center center fixed; }
  #bgvid {
  display: none; }
}

@media (min-width: 481px) and (max-width: 800px) 
{
  html { background: url(images/SF4.jpg) no-repeat center center fixed; }
  #bgvid {
  display: none; }
}

