* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0;
  padding: 0%;
  font-family: "Oswald", sans-serif;
  background-color: #2b1a2d;
  scroll-behavior: smooth;
  overscroll-behavior: contain;
  -webkit-tap-highlight-color: transparent !important;
  outline: none !important;
}

body {
  overscroll-behavior: none;
  height: 100vh;
}

.mainHead {
  height: 7vh;
  width: 100vw;
  background: #cb1f48;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.mainHead a {
  height: 100%;
  width: auto;
  overflow: hidden;
  background: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.mainHead img {
  height: 80%;
  width: auto;
  background: none;
}

.header {
  height: 35vh;
  width: 100vw;
  background-color: #cb1f48;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#cb1f48), to(#2b1a2d));
  background-image: linear-gradient(180deg, #cb1f48 0%, #2b1a2d 100%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.header img {
  border-radius: 0.5rem;
  height: 95%;
  width: auto;
  -o-object-fit: cover;
     object-fit: cover;
}

/* width */
::-webkit-scrollbar {
  width: 0.4rem;
}

/* Track */
::-webkit-scrollbar-track {
  background: #2b1a2d;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #cb1f48;
}

/* Style buttons */
.btn {
  position: absolute;
  right: 1rem;
  width: 3rem;
  height: 3rem;
  border: none;
  color: white;
  cursor: pointer;
  font-size: 1.2rem;
}

.btn a {
  color: white;
}

/* Darker background on mouse-over */
#soundtracks {
  width: 100vw;
  height: 12vh;
  background-color: #2b1a2d;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #ffffff;
  padding-left: 1rem;
  position: relative;
}

.cont {
  height: 40vh;
  overflow: scroll;
  overflow-x: hidden;
}

.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}

.sticky + .content {
  padding-top: 80px;
}

table.GeneratedTable {
  width: 100vw;
  margin: auto;
  background-color: #2b1a2d;
  border-collapse: collapse;
  border-width: 0rem;
  border-color: #ffcc00;
  border-style: solid;
  color: #cecece;
}

table.GeneratedTable td,
table.GeneratedTable th {
  height: 4rem;
  border-width: 0rem;
  border-color: #ffcc00;
  border-style: solid;
  text-align: center;
}

table.GeneratedTable thead {
  background-color: #2b1a2d;
}

tr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  margin-top: 0.3rem;
}

td {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #cb1f48;
}

#number {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 8%;
}

.coverImage {
  width: 15%;
}

.coverImage img {
  height: 100%;
  width: auto;
  -o-object-fit: cover;
     object-fit: cover;
}

.title {
  width: 60%;
  padding-left: 0.5rem;
  text-align: left;
}

#more {
  width: 17%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  overflow: hidden;
  background-color: #cb1f48;
}

#artist {
  font-size: 0.7rem;
}

td img {
  height: 1rem;
}

.plyr {
  height: 6vh;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.plyr--audio .plyr__controls {
  width: 100%;
  height: 100%;
  background: #2b1a2d;
  background: var(--plyr-audio-controls-background, #2b1a2d);
  color: #ffffff;
  color: var(--plyr-audio-control-color, #ffffff);
}

.plyr--audio .plyr__control.plyr__tab-focus,
.plyr--audio .plyr__control:hover,
.plyr--audio .plyr__control[aria-expanded="true"] {
  background: #2b1a2d;
  background: var(--plyr-audio-control-background-hover, var(--plyr-color-main, var(--plyr-color-main, #2b1a2d)));
  color: #fff;
  color: var(--plyr-audio-control-color-hover, #fff);
}

.plyr--full-ui input[type="range"] {
  color: #cb1f48;
  color: var(--plyr-range-fill-background, var(--plyr-color-main, var(--plyr-color-main, #cb1f48)));
}

span[id^="heart"] {
  font-size: 1.3rem;
  width: 100%;
  color: #cecece;
  background-color: #cb1f48;
}

span[id^="heart"] i {
  background-color: #cb1f48;
}

span[id^="heart"].liked {
  color: #2b1a2d;
}
/*# sourceMappingURL=style.css.map */