html {
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

:focus {
  outline: 0;
}

/* Fonts
================================================================================= */
@font-face {
  font-family: "Averia Libre";
  font-style: normal;
  font-weight: normal;
  src: local("Averia Libre Regular"), url("../webfonts/AveriaLibre-Regular.woff") format("woff");
}
@font-face {
  font-family: "Averia Libre";
  font-style: italic;
  font-weight: normal;
  src: local("Averia Libre Italic"), url("../webfonts/AveriaLibre-Italic.woff") format("woff");
}
@font-face {
  font-family: "Averia Libre";
  font-style: normal;
  font-weight: 300;
  src: local("Averia Libre Light"), url("../webfonts/AveriaLibre-Light.woff") format("woff");
}
@font-face {
  font-family: "Averia Libre";
  font-style: italic;
  font-weight: 300;
  src: local("Averia Libre Light Italic"), url("../webfonts/AveriaLibre-LightItalic.woff") format("woff");
}
@font-face {
  font-family: "Averia Libre";
  font-style: normal;
  font-weight: 700;
  src: local("Averia Libre Bold"), url("../webfonts/AveriaLibre-Bold.woff") format("woff");
}
@font-face {
  font-family: "Averia Libre";
  font-style: italic;
  font-weight: 700;
  src: local("Averia Libre Bold Italic"), url("../webfonts/AveriaLibre-BoldItalic.woff") format("woff");
}
/* Setup
================================================================================= */
html {
  background: #6d5f49;
  scroll-behavior: smooth;
}

body {
  font: 400 62.5% "Averia Libre", serif;
  text-align: center;
  color: #5f5b55;
  background: #eee9d9 url("../../img/bg@2x.jpg") repeat 50% 50%;
  background-size: 900px 900px;
}
body.noscroll {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.inner {
  width: 90%;
  max-width: 1150px;
  margin: 0 auto;
  text-align: center;
}

.button {
  display: inline-block;
  padding: 10px 25px;
  font-size: 16px;
  font-style: italic;
  text-decoration: none;
  color: #af9a72;
  border-radius: 34px;
  border: 1px solid #af9a72;
  transition: background 0.1s ease-out, border 0.1s ease-out, color 0.1s ease-out;
}
.button:hover, .button:focus {
  color: #fff;
  background: #8db97e;
  border-color: #8db97e;
}

.heading {
	position: relative;
}

#music .heading img {
  top: -74px;
}

#merch .heading img {
  top: -51px;
}

#tour .heading img {
  top: -46px;
}

#contact .heading img {
  top: -40px;
}

#video .heading img {
  top: -48px;
}

.heading img {
  position: relative;
  max-width: 100%;
  height: auto;
}

.more {
  display: inline-block;
  min-width: 50%;
  padding: 30px 0 0;
  font-size: 2.4em;
  font-style: italic;
  text-transform: uppercase;
  border-top: 1px solid rgba(0, 0, 0, 0.15);
}
@media (max-width: 1023px) {
  .more {
    min-width: 100%;
  }
}
.more a {
  margin: 0 10px;
  text-decoration: none;
  color: #af9a72;
  transition: color 0.1s ease-out;
}
.more a:hover, .more a:focus {
  text-decoration: none;
  color: #8db97e;
}

.thirds {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -35px;
}
@media (max-width: 1023px) {
  .thirds {
    margin: 0 -2.5%;
  }
}
@media (max-width: 767px) {
  .thirds {
    margin: 0;
  }
}
.thirds article {
  width: calc(33.33333333% - 70px);
  margin: 0 35px 75px;
}
@media (max-width: 1023px) {
  .thirds article {
    width: 45%;
    margin: 0 2.5% 60px;
  }
}
@media (max-width: 767px) {
  .thirds article {
    width: 100%;
    max-width: 320px;
    margin: 0 auto 50px;
  }
}
.thirds article img {
  width: 100%;
  height: auto;
  margin-bottom: 30px;
}
@media (max-width: 767px) {
  .thirds article img {
    margin-bottom: 15px;
  }
}
.thirds article h3 {
  margin-bottom: 10px;
  font-size: 2.6em;
  color: #efe3d2;
}
@media (max-width: 767px) {
  .thirds article h3 {
    font-size: 2.4em;
  }
}
.thirds article h4 {
  margin-bottom: 10px;
  font-size: 2em;
  color: #efe3d2;
}
.thirds article p {
  font-size: 1.8em;
  font-style: italic;
}
.thirds article p a {
  text-decoration: none;
  color: #af9a72;
  transition: color 0.1s ease-out;
}
.thirds article p a:hover, .thirds article p a:focus {
  text-decoration: underline;
  color: #8db97e;
}

/* Header
================================================================================= */
#nav {
  position: relative;
  display: flex;
  width: 100%;
  height: 70px;
  align-items: center;
  justify-content: space-between;
  background: #1e2126;
  z-index: 999;
}
@media (max-width: 1023px) {
  #nav {
    height: 50px;
  }
}
#nav #nav-music,
#nav #nav-social {
  display: flex;
  padding: 0 calc(5% - 6px);
}
@media (max-width: 767px) {
  #nav #nav-music,
#nav #nav-social {
    width: 47.5%;
    justify-content: space-between;
  }
}
#nav #nav-music a,
#nav #nav-social a {
  display: block;
  padding: 8px;
  color: #8db97e;
  text-decoration: none;
  transition: color 0.1s ease-out;
}
#nav #nav-music a:hover, #nav #nav-music a:focus,
#nav #nav-social a:hover,
#nav #nav-social a:focus {
  color: #eee9d9;
}
#nav #nav-music {
  padding-right: calc(2.5% - 12px);
}
#nav #nav-social {
  padding-left: calc(2.5% - 12px);
}

header {
  padding-bottom: 70px;
  background: url("../../img/top-texture@2x.png") no-repeat 50% 100%;
  background-size: auto 100%;
}
@media (max-width: 767px) {
  header {
    margin-bottom: -35px;
  }
}
header .inner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 90%;
  max-width: 1150px;
  margin-top: -75px;
}
@media (max-width: 1023px) {
  header .inner {
    margin-top: 0;
    padding: 15px 0 50px;
  }
}
header .inner ul {
  display: flex;
  margin: 0 -15px;
}
@media (max-width: 767px) {
  header .inner ul {
    display: none;
  }
}
header .inner ul li {
  margin: 0 15px;
  font-size: 2.8em;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
@media (max-width: 1023px) {
  header .inner ul li {
    margin: 0 15px;
    font-size: 2.4em;
  }
}
header .inner ul li a {
  text-decoration: none;
  color: #e4d4ae;
  transition: color 0.1s ease-out;
}
header .inner ul li a:hover {
  color: #fff;
}
header .inner #logo {
  position: relative;
  flex-shrink: 4;
  margin: 0 20px;
  z-index: 1000;
}
@media (max-width: 767px) {
  header .inner #logo {
    margin: 0 auto;
  }
}
header .inner #logo img {
  width: 100%;
  height: auto;
}

/* Homepage
================================================================================= */
#news {
  padding-bottom: 34px;	
}
#news article {
  display: flex;
  text-align: left;
}
@media (max-width: 1023px) {
  #news article {
    flex-direction: column;
  }
}
#news article .post-title {
  flex-shrink: 0;
  width: calc(33.33333333% - 35px);
  margin-right: 70px;
  text-transform: uppercase;
}
@media (max-width: 1023px) {
  #news article .post-title {
    width: 100%;
    margin-right: 0;
    margin-bottom: 15px;
  }
}
#news article .post-title h3 {
  font-size: 2.8em;
}
@media (max-width: 1023px) {
  #news article .post-title h3 {
    font-size: 2.4em;
  }
}
#news article .post-title time {
  font-size: 1.8em;
  color: #c2251a;
}
#news article .post-content {
  margin-bottom: 60px;
}

#music {
  background: #343430;
  padding-bottom: 125px;
}
@media (max-width: 767px) {
  #music {
    padding-bottom: 110px;
  }
}
#music article {
	
}
#music article:nth-of-type(1n+7) {
	display: none;
}
#music .more {
	display: block;
}
@media (max-width: 767px) {
	#music article:nth-of-type(1n+5) {
		display: none;
	}
	#music .more {
		display: block;
	}
}

#music .more {
  border-top: 1px solid rgba(255, 255, 255, 0.15);
}

#merch {
  padding-bottom: 125px;
  background: rgba(255, 255, 255, 1.0);
}
@media (max-width: 767px) {
  #merch {
    padding-bottom: 90px;
  }
}
#merch h3 {
  margin-bottom: 20px;
  color: #343430;
}

#tour {
  padding-bottom: 108px;
}
@media (max-width: 767px) {
  #tour {
    padding-bottom: 80;
  }
}

#contact {
  background: #343430;
  padding-bottom: 50px;
}
@media (max-width: 767px) {
  #contact {
    padding-bottom: 30px;
  }
}
#contact h3 {
  color: #e4d4ae;
}
#video {
  padding-bottom: 70px;
}
@media (max-width: 767px) {
  #video {
    padding-bottom: 30px;
  }
}

/* Footer
================================================================================= */
#footer {
  display: flex;
  justify-content: space-between;
  padding: 40px 5%;
  font-size: 1.3em;
  color: #efe3d2;
  background: #6d5f49;
}
@media (max-width: 767px) {
  #footer {
    flex-direction: column;
    padding: 25px;
  }
  #footer #footer-copyright {
    margin-bottom: 10px;
  }
}
#footer a {
  text-decoration: none;
  color: #bfa87d;
  transition: color 0.1s ease-out;
}
#footer a:hover, #footer a:focus {
  text-decoration: underline;
  color: #fff;
}