:root {
  --dark-grey: #666;
  --bg-grey: #f5f5f5;
  --light-grey: #c7c7c7;
  --primary: #eea959;
  --highlight: #86c782;
}

* {
  outline: none;
}

body {
  background-color: var(--bg-grey);
  background-image: url(../images/sponsor/bg-top.png),
  url(../images/sponsor/logo.png);
  background-size: 30%;
  background-position: top right, top left;
  background-repeat: no-repeat;
  padding-top: 80px;
  color: var(--dark-grey);
}

.main {
  background-image: url(../images/sponsor/bg-bottom.png);
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: 30%;
  min-height: 60vh;
}

.wrapper {
  max-width: 700px;
  width: 100%;
  margin: 0 auto;
}

.page-title::before,
.page-title::after {
  content: '//';
  color: var(--highlight);
}

.footer {
  background-color: #5bb507;
  background-image: url(../images/sponsor/bg-footer.png);
  background-size: auto 500px;
  background-position: bottom;
  color: white;
}

.footer a {
  color: white;
  text-decoration: none;
}

.footer a.btn {
  color: var(--highlight);
  background-color: white;
  border-radius: 30px;
}

@media only screen and (max-width: 600px) {
  body {
    background-image: url(../images/sponsor/bg-top.png),
    url(../images/sponsor/logo-mobile.png);
    background-size: 60%, 40%;
    font-size: 12px;
  }

  .main {
    background-size: 60%;
  }
}