/* See license.txt for terms of usage */

/* Fonts */

@font-face {
  font-family: 'Open Sans Light';
  src: url('opensans-light.ttf');
}

@font-face {
  font-family: 'Open Sans';
  src: url('opensans-regular.ttf');
}

@font-face {
  font-family: 'Open Sans SemiBold';
  src: url('opensans-semibold.ttf');
}

/* Global styles */

html {
  display: table;
  margin: auto;
}

body {
  display: table-cell;
  padding: 0;
  text-align: center;
  background-color: rgba(211, 211, 211, 0.2);
  color: black;
  font-family: 'Open Sans';
}

h1 {
  height: 38px;
  font-family: 'Open Sans Light';
  font-size: 36.0px;
  font-weight: 400;
}

p {
  display: inline-block;
  font-size: larger;
  width: 857px;
}

a {
  color: #3c77fe;
}

/* Page layout and Content */

#layout {
  display: inline-block;
}

#content {
  background-color: white;
  text-align: center;
  padding-top: 110px;
  width: 1440px;
}

/* Components */

.button {
  display: inline-block;
  width: 285px;
  height: 54px;
  background-image: url('button-devedition.png');
  background-repeat: no-repeat;
}

/* Header Section */

#header-section {
  padding-top: 30px;
  padding-bottom: 83px;
}

#header-section p {
  padding-top: 15px;
  padding-bottom: 20px;
}

#header-section .button {
  margin-bottom: 25px;
}

#header-section .linkbar a {
  padding-left: 20px;
}

/* Timeline Section */

#timeline-section {
  height: 999px;
  background-image: url('timeline.png');
  background-repeat: no-repeat;
}

/* Contributors Section */

#contributors-section {
  padding-top: 80px;
  padding-bottom: 100px;
}

#contributors-section p {
  padding-top: 15px;
  padding-bottom: 20px;
}

#contributors-section > #members {
  width: 1084px;
  display: inline-block;
  font-family: 'Open Sans';
}

#contributors-section div.table-box {
  display: flex;
  flex-direction: row;
}

#contributors-section div.table-item {
  flex: 1;
}

#contributors-section table {
  width: 100%;
  padding: 20px;
}

/* Some name are long, so give this table a bit more space. */
#contributors-section table.translators {
  width: 120%;
}

#contributors-section table > tbody,
#contributors-section table > thead {
  width: 100%;
}

#contributors-section td {
  width: 50%;
}

#contributors-section th,
#contributors-section td {
  text-align: left;
}

#contributors-section th {
  border-bottom: 1px solid lightgray;
  font-size: 20px;
  font-weight: normal;
}

/* DevTools Section */

#devtools-section {
  height: 927px;
  background-image: url('background.png');
  background-repeat: no-repeat;
  color: white;
}

#devtools-section img.icon {
  padding-top: 90px;
  width: 110px;
  height: 110px;
}

#devtools-section .toolbar {
  padding-top: 40px;
  padding-bottom: 40px;
}

#devtools-section a.button-download {
  background-image: url('button-devedition.png');
  background-repeat: no-repeat;
}

#devtools-section a.button-update {
  background-image: url('button-update-browser.png');
  background-repeat: no-repeat;
}

#devtools-section a {
  color: white;
}

#devtools-section .hero-box {
  height: 354px;
  overflow: hidden;
}

#devtools-section img.hero {
  padding-top: 17px;
}

/* Footer Section*/

#footer-section {
  background-color: black;
  height: 25px;
  padding-top: 30px;
}