/* Copyright 2012 Google Inc. All Rights Reserved. */
@font-face {
  font-family: coda_regular;
  src: url('../ttf/coda_regular.ttf');
}
html, body {
  font-family: 'PT Sans', sans-serif;
  font-weight: 400;
  height: 100%;
  margin: 0;
  padding: 0;
  width: 100%;
}
body {
  background: #000 url(//storage.googleapis.com/ingress.com/img/landing/bg.jpg) no-repeat center center fixed;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  font-size: 1.0em;
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
}
a {
  color: #11ecf7;
  text-decoration: none;
}
#nav {
  background: rgb(0, 0, 0);
  padding-top: .25em;
  padding-bottom: .25em;
  color: #fff;
  left: 0;
  list-style-type: none;
  height: 3em;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
}
#menu{
  display:inline-block;
}
#social{
  display:inline-block;
  float:right;
  margin-top: -.35em;
}
.nav_element {
  display: inline;
  margin-right: 5%;
  white-space: nowrap;
}
li.nav_element a{
  color:white;
}
.nav_icon {
  vertical-align: middle;
  margin: auto 1em .2em 1em;
  width: 1.2em;
  height: 1.2em;
}
.soc_icon {
  vertical-align: middle;
  margin: auto .5em .2em .5em;
  width: 1.8em;
  height: 1.8em;
}
#quote {
  font-family: coda_regular, sans-serif;
  font-weight: 400;
  left: 0px;
  font-size: 2.3em;
  color: #fec80c;
  padding: 15px 200px 20px 50px;
  line-height: 1.2;
  width: 55%;
  z-index: 10;
}
#quote-text {
  width: 800px;
}
.gradient {
  background-image: -webkit-gradient(
    linear, left top, right top, from(rgba(0, 0, 0, 0.75)),
    to(rgba(0, 0, 0, 0))
  );
  background-image: -moz-linear-gradient(
    left center,
    rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 95%
  );
}
#dark_container {
  background: rgb(0, 0, 0);
  background: rgba(0, 0, 0, 0.70);
  bottom: 0;
  color: #fff;
  height: 210px;
  left: 0;
  position: absolute;
  width: 100%;
}
#dark_container, #footer {
  min-width: 900px;
}
#about {
  left: 420px;
  position: absolute;
}
#copyright {
  left: 620px;
  position: absolute;
}
#phone {
  background: url(//storage.googleapis.com/ingress.com/img/landing/phonev2.png) no-repeat;
  background-size: cover;
  bottom: 0px;
  height: 590px;
  left: 20px;
  margin: 0;
  position: absolute;
  padding: 0;
  width: 380px;
  z-index: 5;
  text-align: center;
}
#play_button {
  background: url(//storage.googleapis.com/ingress.com/img/landing/playbtn_default_v2.png) no-repeat;
  background-size: cover;
  display: block;
  width: 81px;
  height: 82px;
  left: 50%;
  margin-left: -40px;
  margin-top: -47px;
  position: absolute;
  top: 55%;
}
#play_button:hover {
  background: url(//storage.googleapis.com/ingress.com/img/landing/playbtn_hover_v2.png) no-repeat;
}
div#preload {
  background: url(//storage.googleapis.com/ingress.com/img/landing/playbtn_hover_v2.png) no-repeat -9999px -9999px;
  height: 1px;
  left: 0px;
  position: fixed;
  top: 0px;
  width: 1px;
}
#logo {
  float: left;
  height: 48px;
  left: 420px;
  position: relative;
  top: 0;
  vertical-align: bottom;
}
#logo img {
  height: 50px;
  margin: 0;
  padding: 5px 0 0 0;
  width: 172px;
}
#footer {
  background-color: #000;
  bottom: 0px;
  height: 65px;
  margin: 0;
  padding-top: 8px;
  position: absolute;
  width: 100%;
}
#about h2 {
  color: #11ecf7;
  font-family: coda_regular, sans-serif;
  font-size: 2.3em;
  font-weight: 400;
  margin: 0;
  padding: 13px 0 5px 0;
}
#about_text {
  font-weight: 400;
  font-size: 1.2em;
}
#copyright {
  color: #666;
  top: 50%;
}
.tiny {
  font-size: 0.7em;
  padding: 0;
  margin: 0;
  display: block;
}
.tiny a {
  color: #00c5cf;
}
.blue {
  color: #11ecf7;
}
#video_overlay {
  background-color: rgb(0, 0, 0);
  background-color: rgba(0, 0, 0, 0.8);
  bottom: 0px;
  position: fixed;
  left: 0px;
  right: 0px;
  top: 0px;
  width: auto;
  z-index: 1000;
}

#landing_video {
  height: 510px;
  left: 50%;
  margin-left: -426px;
  margin-top: -255px;
  position: absolute;
  top: 50%;
  width: 854px;
}

@media (max-width: 1280px) {
  body {
    font-size: 90%;
  }
  #about, #logo {
    left: 380px;
  }
  #copyright {
    left: 570px;
  }
  #phone {
    height: 528px;
    width: 340px;
  }
}

@media (max-width: 1150px) {
  body {
    font-size: 90%;
  }
  #quote {
    font-size: 2.4em;
    line-height: 1.1;
    padding: 15px 200px 20px 50px;
  }
  #about, #logo {
    left: 380px;
  }
  #copyright {
    left: 570px;
  }
  #phone {
    height: 528px;
    width: 340px;
  }
}

@media (max-width: 700px), (max-height: 700px) {
  body {
    font-size: 85%;
  }
  #about, #logo {
    left: 320px;
  }
  #copyright {
    left: 500px;
  }
  #phone {
    height: 434px;
    width: 280px;
  }
}

@media (max-width: 700px) {
  #quote-text {
    width: 400px;
  }
}

#getit {
  background: url(//storage.googleapis.com/ingress.com/img/landing/download_googleplay.png) no-repeat;
  bottom: 38px;
  height: 44px;
  left: 340px;
  position: absolute;
  width: 128px;
}
#appstore {
  background: url(//storage.googleapis.com/ingress.com/img/landing/download_appstore.png) no-repeat;
  bottom: -10px;
  height: 38px;
  left: 340px;
  position: absolute;
  width: 128px;
}
#events {
  background: url(//storage.googleapis.com/ingress.com/img/landing/live_events_banner.png) no-repeat;
  bottom: -14px;
  height: 99px;
  left: 483px;
  position: absolute;
  width: 137px;
}
