@charset "UTF-8";

body {
  margin: 0px;
  padding: 0px;
  font-size: 16px;
  font-weight: 300;
  background: #666666;
  background: white;
}

body,
h1,
h2,
h3,
h4 {
  font-family: 'Helvetica neue', helvetica;
}

a {
  text-decoration: none;
  font-weight: bolder;
  color: #a5c736;
}

a:hover {
  text-decoration: underline;
}

#page-container {
  margin: 0px auto;
  width: 960px;
}

img {
  border: none;
}

/**
 * Main section
 */

#main {
  height: 396px;
  position: relative;
  background-image: url('../img/guidio_top_image.jpg');
  background-position: top center;
  background-repeat: no-repeat;
  margin: 0px;
}

#nav {
  background-image: url('../img/topbar.png');
  background-position: top left;
  background-repeat: no-repeat;
  height: 20px;
  position: relative;
}

#nav a {
  color: #647822;
  text-decoration: none;
  margin-right: 20px;
}

#nav a.selected {
  color: #f8faf8;
}

#nav-left {
  margin-left: 180px;
}

#nav-right {}

#logo {
  position: absolute;
  top: 110px;
  left: 145px;
}

#logo h1,
#logo h2 {
  display: none;
}

#links {
  position: absolute;
  bottom: 132px;
  left: 160px;
}
  
#tour {
  position: absolute;
  bottom: 80px;
  left: 160px;
}

#tour-images {
  display: none;
}

#links div {
  float: left;
  margin-right: 30px;
}

#links img {
  display: block;
}

#hand {
  position: absolute;
  bottom: 0px;
  right: 130px;
}

#hand img {
  display: block;
}

/**
 * Fact sections - common styles
 */

.fact {
  background: #fff;
  margin: 0px;
  margin: 0px 90px;
  border-bottom: #abc360 solid 1px;
  position: relative;
  height: 396px;
  clear: both;
}

.last-fact {
  border: none;
}

.fact h3 {
  font-size: 28px;
  font-weight: 200;
  margin: 0px;
}

.fact p {
  margin: 30px 0px;
}

/* fact block 1 - "Free curated content ..." */

#fact1 img {
  position: absolute;
  bottom: 0px;
  left: 30px;
  display: block;
}

#fact1-text {
  position: absolute;
  bottom: 45px; /* vertical alignment */
  right: 60px;
  width: 330px;
}

/* fact block 2 - "Data roaming" */

#fact2 img {
  position: absolute;
  bottom: 120px;
  right: 90px;
  display: block;
}

#fact2-text {
  position: absolute;
  left: 90px;
  bottom: 110px; /* vertical alignment */
  width: 360px;
}

/* fact block 3 - "Find museums..." */

#fact3 img {
  position: absolute;
  bottom: 0px;
  left: 30px;
  display: block;
}

#fact3-text {
  position: absolute;
  bottom: 60px; /* vertical alignment */
  right: 60px;
  width: 330px;
}

/* fact block 4 - "Example grid" */

#fact4 {
  padding: 60px 0px;
}

#fact4-grid {
  margin-left: 30px;
}

.grid3-column {
  float: left;
  width: 200px;
  margin-left: 30px;
  text-align: center;
}

.grid3-column p {
  margin: 30px 0px;
}

/* fact block 5 - "No need to borrow.." */

#fact5 img {
  position: absolute;
  bottom: 0px;
  left: 30px;
  display: block;
}

#fact5-text {
  position: absolute;
  bottom: 45px; /* vertical alignment */
  right: 60px;
  width: 330px;
}

/* fact block 6 - "Language" */

#fact6 img {
  position: absolute;
  bottom: 120px;
  right: 90px;
  display: block;
}

#fact6-text {
  position: absolute;
  left: 90px;
  bottom: 120px; /* vertical alignment */
  width: 330px;
}

/* fact block 7 - "Rocket" */

#fact7 {
  padding: 30px 0px;
}

#fact7 img {
  display: block;
  margin: auto;
}

#fact7 h3 {
  text-align: center;
  margin-bottom: 40px;
}

#fact7-text {
  width: 550px;
  margin: 0px auto;
}

#fact7 li {
  line-height: 150%;
}

/**
 * FAQ section
 */

#faq {
  background: #000;
  color: #fff;
  margin: 0px;
  padding: 50px;
  font-size: 16px;
}

#faq h3 {
  font-size: 28px;
  font-weight: 200;
  margin: 10px 0px;
}

#faq h4 {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 5px;
}

#faq p {
  margin: 0px;
  font-weight: 200;
}

.question {
  margin: 40px 0px;
}

/**
 * Footer
 */

#footer {
  background: #fff;
  height: 30px;
  margin: 0px;
  padding: 1px;
}

#footer ul {
  list-style: none;
  float: left;
  margin: 0px;
  padding: 5px 50px;
}

#footer ul li {
  float: left;
  margin: 0px 30px 0px 0px;
}
