:root{
  --maincolor: rgb(36, 36, 36); 
  --secondcolor: rgb(240, 240, 240);  
  --shadow: lab(2.59% -1.7 -2.62 / 0.365);
  /* --shadow: hwb(197 44% 6% / 0.365); */
  --listencolor: #b9fafc;
  --listencolorover: hsl(182, 94%, 50%);
  --img: url("../img/background.jpg");
}

body {
  font-family: sans-serif;
  margin: 0;
  color: var(--maincolor);
  background-color: var(--secondcolor);
  box-sizing: border-box;
  position: relative;
}

.mainContainer {
  width: 100%;
  min-height: 100vh;
  display: flex;
  background-image: var(--img); 
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  position: relative;
}

.textShadow {
  filter: drop-shadow(0 0 .2rem var(--shadow));
  text-shadow: -.2rem .15rem .15rem var(--shadow) ;
}

a {
    text-decoration: none;
}

a:link {
  color: var(--listencolor);
}

/* visited link */
a:visited {
  color: var(--listencolor);
}

/* mouse over link */
a:hover {
  color: var(--listencolor);
}

/* selected link */
a:active {
  color: var(--listencolor);
}

.listenSources {
  margin-top: 15px;
}

.listenLink {
    color: var(--listencolor);
    padding-left: 25px;
    font-weight: 600;
    font-size: 2.4rem;
    margin-bottom: 25px; 
}

.listenLink:hover {
  color: var(--listencolorover);
}