/* Fonts */
@font-face {
  font-family: 'NittiGrotesk';
  src: url('../fonts/NittiGrotesk-Normal.otf');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'NittiGrotesk';
  src: url('../fonts/NittiGrotesk-Bold.otf');
  font-weight: 700;
  font-style: normal;
}

/* General */
* {
  margin: 0;
  padding: 0;
}

body {
  font: normal normal 400 24px/160% 'NittiGrotesk', sans-serif;
  color: rgba(255, 255, 255, 1);
  background-color: rgba(90, 200, 175, 1);
}

a {
  outline: none;
}

/* Layout */
.wrapper {
  position: relative;
  width: 90%;
  min-width: 700px;
  max-width: 1000px;
  margin: 0 auto;
}

#header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background-color: rgba(69, 80, 82, 1);
  z-index: 9999;
}

#header .wrapper {
  height: 64px;
}

#header h1 a {
  position: absolute;
  left: 0;
  width: 77px;
  height: 92px;
  text-indent: -99999px;
  background: transparent url('../img/logo-small.svg') left top no-repeat;
  background-size: 77px 92px;
  z-index: 9999;
}

#header .nav {
  position: absolute;
  bottom: 4px;
  width: 100%;
  text-align: center;
}

#header .nav li {
  display: inline-block;
  list-style-type: none;
}

#header .nav li a {
  display: block;
  padding: 0 20px;
  line-height: 24px;
  color: rgba(255, 255, 255, 1);
  text-decoration: none;
}

#header .nav li a:hover {
  color: rgba(209, 110, 79, 1);
}

#header .nav .fb a {
  padding: 0;
  margin-left: 30px;
  width: 18px;
  height: 20px;
  text-indent: -99999px;
  background: transparent url('../img/fb.svg') left 2px no-repeat;
  background-size: 36px 18px;
}

#header .nav .fb a:hover {
  background-position: right 2px;
}

#content {
  padding: 110px 0;
}

#content .logo {
  text-align: center;
}

#content .logo img {
  width: 56%;
}

/* Sponsoring */
.sponsoring {
  width: 76%;
  margin: 60px auto;
  text-align: center;
}

.sponsoring .row {
  margin: 10px 0;
}

.sponsoring img {
  height: 70px;
  margin-left: 30px;
}

.sponsoring img:first-child {
  margin-left: 0;
}

/* Markdown */
.markdown {
  width: 76%;
  margin: 20px auto;
  color: rgba(69, 80, 82, 1);
}

.markdown h1,
.markdown h2,
.markdown h3,
.markdown h4,
.markdown h5,
.markdown h6,
.markdown p,
.markdown ul {
  margin-bottom: 20px;
}

.markdown h1,
.markdown h2 {
  font-size: 40px;
  line-height: 44px;
  font-weight: 700;
}

.markdown h1 {
  margin-top: 80px;
}

.markdown h2 {
  font-weight: 400;
}

.markdown p {
  line-height: 140%;
}

.markdown a {
  color: rgba(209, 110, 79, 1);
}

.markdown a:hover {
  text-decoration: none;
}

.markdown img {
  width: 100%;
}

.markdown ul {
  padding-left: 22px;
}
