* { padding: 0; margin: 0; outline: 0; }
html,
body { padding: 0; margin: 0; outline: 0; height: 100%; width: 100%; min-width: 320px !important; font-family: 'Roboto Condensed', sans-serif; background-color: #000; overflow: hidden; }
body { position: relative; }

#container { position: absolute; left: 0; top: 0; width: 100%; height: 100%; min-height: 100%; opacity: 0; overflow-x: hidden; overflow-y: auto; z-index: 1; }
#video-bg { display: block; position: fixed; top: 0; left: 0; overflow: hidden; width: 100%; z-index: 0; pointer-events: none; }
#content { display: block; position: relative; margin: 0 auto; text-align: center; z-index: 1; }

.button { margin: 0 auto; max-width: 300px; border: none; border-radius: 6px; background: #8EB629; font-size: 16px; color: #FFF; -webkit-appearance: none; cursor: pointer; }
.button:hover { background: #9bc339; }
.button a { display: block; margin: 0 auto; padding: 11px 16px 11px 17px; color: #FFF; white-space: nowrap; }

#nav-container { position: absolute; top: 0; right: 20px; }
.nav { float: left; margin-right: 5px; background: #FFF; color: #000; font-weight: bold; cursor: pointer; }
.nav a { display: block; margin: 0 auto; padding: 16px; color: #000; }

#logo { margin-top: 120px; z-index: 1; }

a { text-decoration: none; } 
h1 { margin-top: 60px; font-family: 'Open Sans'; font-weight: 300; line-height: 36px; font-size: 36px; color: #aeaeae; }
h2 { margin-top: 5px; font-family: 'Open Sans'; font-weight: 300; line-height: 54px; font-size: 54px; color: #FFF; text-shadow: 0px 0px 24px #3c4545; }
.text.green { color: #add940; }
.text.grey { color: #aeaeae; }

#demo { margin-top: 60px; width: 960px; height: 540px; }

#subscribe { margin-top: 40px; font-family: 'Open Sans'; font-weight: 300; font-size: 18px; color: #FFF; }
#mc_embed_signup { margin-top: 10px; }
#mce-EMAIL { padding: 11px; min-width: 400px; border: 1px solid #FFF; border-radius: 6px 0 0 6px; font-size: 16px; opacity: 0.5; -webkit-appearance: none; }
#mce-EMAIL:focus { opacity: 0.8; }
#mc-embedded-subscribe { padding: 11px 16px 11px 17px; border: none; border-radius: 0 6px 6px 0; background: #8EB629; font-size: 16px; color: #FFF; -webkit-appearance: none; cursor: pointer; }
#mc-embedded-subscribe:hover { background: #9bc339; }

#inquiry { margin-top: 40px; margin-bottom: 40px; font-family: 'Open Sans'; font-weight: 300; font-size: 14px; }
#copyright { margin-top: 20px; margin-bottom: 10px; font-family: 'Arial'; font-size: 12px; font-color: #CCC; }

small { font-size: 8px; }

@media (max-width: 1140px){
    .nav { font-size: 12px; }
    #logo { margin-top: 80px; }
    h1 { margin-top: 50px; line-height: 28px; font-size: 28px; }
    h2 { line-height: 42px; font-size: 42px; }
    #demo { margin-top: 40px; width: 720px; height: 404px; }
    #logo { width: 248px; height: 47px; }
    #subscribe { margin-top: 40px; font-size: 16px; }
    #inquiry { font-size: 14px; }
}

@media (max-width: 720px){
    h1 { margin-top: 30px; line-height: 20px; font-size: 20px; }
    h2 { line-height: 32px; font-size: 32px; }
    #demo { width: 480px; height: 270px; }
    #subscribe { margin-top: 20px; font-size: 14px; }
    #inquiry { font-size: 12px; }
    #mce-EMAIL { min-width: 100px; padding: 6px; font-size: 14px; }
    #mc-embedded-subscribe { padding: 6px 8px 6px 9px; font-size: 14px; }
}

@media (max-width: 480px){
    #demo { width: 320px; height: 180px; }
}