/* --------------------------------- */
/* Variables */
/* --------------------------------- */

:root {
  --ax-color: #a5e32a;
  --ax0-color: #00a29e;
  --ax1-color: #a5e32a;
  --seprator-color: #aaaaaa;
}


/* --------------------------------- */
/* Album Colors Classes */
/* --------------------------------- */

.ax0 {
  color: var(--ax0-color);
}

.ax1 {
  color: var(--ax1-color);
}


/* --------------------------------- */
/* Custom Classes */
/* --------------------------------- */

.headerlink {
  text-decoration: none;
}

img.albumcover {
  float: right;
  width: 304px;
}

img.albumlist {
  width: 320px;
}

img.toplogo {
  margin-bottom: 5px;
  margin-top: 5px;
}

img.portrait {
  float: right;
  max-width: 320px;
}

ol.tracks {
  font-style: italic;
}

table.bio {
  border-collapse: collapse;
}

table.bio td {
  border-bottom: 1px solid var(--seprator-color);
  padding: 4px;
}

table.main {
  background: #000000;
  height: 100vh;
  width: 640px;
  margin: 0px;
  padding-left: 4px;
}

td.main {
  vertical-align: top;
}


/* --------------------------------- */
/* Mobile Styling */
/* --------------------------------- */

@media (max-width: 639px) {

  img.albumcover {
    float: none;
    width: 80%;
  }

  img.portrait {
    float: none;
    max-width: 100%;
  }

  table.bio {
    width: 100%;
  }

  table.main {
    width: 100%;
  }
}


/* --------------------------------- */
/* Tag Styles */
/* --------------------------------- */

a {
  color: var(--ax-color);
}

b {
  font-family: "Times 95 - 12 at 16px Bold", "Times New Roman", Times, serif;
}

body {
  font-size: 16px;
  font-family: "Times 95 - 12 at 16px", "Times New Roman", Times, serif;
  background-color: black;
  color: white;
  margin: 0px;
  background: linear-gradient(0deg,#527115 0%, #29380a 5%, #000000 20%, #000000 100%);
}

h1,h2,h3,h4,h5,h6 {
  margin-bottom: 8px;
}

h2 {
  font-size: 24px;
  font-family: "Times 95 - 18 at 24px Bold", "Times New Roman", Times, serif;
}

h3 {
  font-size: 18px;
  font-family: "Times 95 - 16 at 18px Bold", "Times New Roman", Times, serif;
}

ol,ul {
  margin-top: 4px;
}


/* --------------------------------- */
/* Album Color Body Classes */
/* --------------------------------- */

body.ax0-body {
  background: linear-gradient(0deg,#00514f 0%, #002827 5%, #000000 20%, #000000 100%);
}

body.ax0-body a {
  color: var(--ax0-color);
}

body.ax0-body img.toplogo {
  content: url('img/logo/araxeus_logo_ax0.png');
}

body.ax1-body a {
  color: var(--ax1-color);
}


/* --------------------------------- */
/* Custom Bitmap Fonts */
/* --------------------------------- */

@font-face {
    font-family: 'Times 95 - 12 at 16px';
    src: url('fonts/Times95-12at16px.woff2') format('woff2'),
        url('fonts/Times95-12at16px.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Times 95 - 12 at 16px Bold';
    src: url('fonts/Times95-12at16pxBold.woff2') format('woff2'),
        url('fonts/Times95-12at16pxBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Times 95 - 16 at 18px Bold';
    src: url('fonts/Times95-16at18pxBold.woff2') format('woff2'),
        url('fonts/Times95-16at18pxBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Times 95 - 18 at 24px Bold';
    src: url('fonts/Times95-18at24pxBold.woff2') format('woff2'),
        url('fonts/Times95-18at24pxBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Times 95 - 12 at 16px Italic';
    src: url('fonts/Times95-12at16pxItalic.woff2') format('woff2'),
        url('fonts/Times95-12at16pxItalic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}