body {
 background-color: #000000;
 color: #444;
 font-family: Arial, Helvetica, sans-serif;
 font-size: 1em;
 line-height: 1.5em
}
.clear {
 clear: both;
}
p {
 padding: 0 50px;
}
section {
 margin: 0;
 width: 100%;
 text-align: center;
}
#header {
 width: 100%;
 position: absolute;
 z-index: 100;
}
#bg {
 position: relative;
 height: 500px;
 width: 100%;
 overflow: hidden;
}
#hero {
 background:rgba(0,0,0,0.5);
 color: white;
 padding: 5em 0 10em;
 text-align: center;
}
#hero h2, #one h2, #two h2, #footer h2 {
 font-size: 3.5em;
 line-height: 1.1em;
}
.video-bg {
 background-color: black;
 background-size: cover;
 position: fixed;
 top: 0%;
 left: 50%;
 min-width: 100%;
 min-height: 1000px;
 width: auto;
 height: auto;
 z-index: -100;
 -webkit-transform: translateX(-50%) translateY(0%);
 transform: translateX(-50%) translateY(0%);
 overflow: hidden;
}
nav {
 z-index: 999;
}
#nav a {
 color: whitesmoke;
 font-size: 1.2em;
 text-decoration: none;
 /* text-transform: uppercase; */
}
#nav ul.home {
 float: left;
}
#nav ul.links {
 float: right;
}
#nav li:first-child {
 display: inline-block;
 list-style: none;
}
#nav li {
 display: inline-block;
 list-style: none;
 margin-right: 30px;
}
.button {
 background:rgba(255,255,255,0.1);
 border: 1px solid white;
 padding: 1.5em 3em;
 border-radius: 5px;
 margin-top: 40px;
 transition: background-color 0.3s ease;

}
a .button {
 color: white;
 font-size: 1.3em;
 text-decoration: none;
}
.button:hover {
 background:rgba(107,142,35,0.95);
}
.third {
 float: left;
 width: 33.3333%;
 padding: 40px 0px;
}
#one {
 background-color: olivedrab;
 color: gainsboro;
 padding: 75px 0;
}
#one h2, #two h2, #footer h2 {
 color: white;
 font-size: 2em;
}
#two {
 background-color: whitesmoke;
 color: black;
 padding: 75px 0;
}
#two h2 {
 color: olivedrab;
}
.fa-wordpress { color: #21759b; }
.fa-html5 { color: #E34C26; }
.fa-google {color: #0266C8; }

#footer {
 background-color: rgba(0,0,0,.95);
 color: white;
}
#footer .row {
 width: 100%;
 padding: 75px 0;
}
#footer .center {
 width: 50%;
 text-align: center;
 margin: auto; 
}

.copyright {
 background-color: olivedrab;
 padding: 20px 0 40px;
 text-align: center;
 margin-bottom: 0;
}
.copyright a {
 color: white;
 text-decoration: none;
}

/* --- RESPONSIVE/MOBILE ---  */

@media screen and (max-width: 500px) {
	#bg { background-image: url('http://serverfive.com/images/ethernet.jpg'); background-position: center; background-size: cover; }
	.video-bg { display: none; }
	#nav { display: none; }
	#hero { padding: 5em 0 12em; }
	.third { width: 100%; }
	#footer .center { width: 100%; }
}