@import url('http://fonts.googleapis.com/css?family=Raleway:300,200');

body {
    margin: 0;
    padding: 0;
}

.content {
    margin: 0 0;
    width: 100%;
    padding: 0px 0px;
}

.header {
    position: absolute;
    width: 100%;
    height: 22.1%;
    background: url("header-075.png") repeat;
}

.grid {
    position: absolute;
    top: 22%;
    width: 100%;
    height: 38%;
    position: absolute;
    background: transparent url("bg.gif") repeat;
    background-size: 3px 3px
}

.footer {
    position: absolute;
    top: 60%;
    width: 100%;
    min-height: 40%;
    background: url("footer.png") repeat;
}

a:link {
  color: #007b92;
}

a:visited {
  color: #007b92;
}

a:hover {
  color: #004f64;
}

p {
    margin: 0 0 0 0;
    font-family: 'Raleway';
    font-size: 1.00em;
    font-weight: 300;
    line-height: 150%;
    color: #222222;
}

.htext{
   position: absolute;
   font-family: 'Raleway';
   font-size: 1.5em;
   font-weight: 200;
   top: 6.5%;
   left: 20%;
   right: 20%;
}

.text{
   position: relative;
   padding-top: 3%;
   padding-bottom: 6%;
   left: 20%;
   right: 20%;
   width: 60%;
}

.twitter {
   position: absolute;
   top: 7%;
   right: 10%;
}

.fullscreenBackground {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    z-index: -100;
}

.fullscreenBackgroundVideo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

@media (min-aspect-ratio: 16/9) {
    .fullscreenBackgroundVideo {
        height: 300%;
        top: -100%;
    }
}

@media (max-aspect-ratio: 16/9) {
    .fullscreenBackgroundVideo {
        width: 300%;
        left: -100%;
    }
}

@media (max-width: 950px) {
    .fullscreenBackground {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	z-index: -100;
    }

    .fullscreenBackgroundVideo {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
    }
}
