:root {
--bs-form-select-bg-img: none;
}
html {
height: 100%;
width: 100%;
}
body {
width: 100%;
padding-bottom: 50px; /* */
}
.navbar {
border-top: 1px solid var(--bs-border-color);
background-color: white;
}
.card img {
cursor: pointer;
}
.card-legend > * {
padding-top: 2px;
}
#cursor {
width: 25px;
text-align: center;
}
#copyright a {
text-decoration: none;
}
header .list-unstyled a {
text-decoration: none;
}
#vinyl_brand_svg {
width: auto;
height: 31px;
}
#playlist_switch {
border: 1px solid var(--bs-border-color);
border-radius: var(--bs-border-radius-sm);
height: 31px;
}
#playlist_switch > * {
display: inline;
align-self: baseline;
}
#sort_button > * {
border-color: var(--bs-border-color) !important;
}
#vinyl_share {
background-image: url(data:image/svg+xml,%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M17%202.498a3.502%203.502%200%201%201-2.597%205.851l-4.558%202.605a3.5%203.5%200%200%201%200%202.092l4.557%202.606a3.502%203.502%200%201%201-.745%201.302L9.1%2014.348a3.502%203.502%200%201%201%200-4.698l4.557-2.604A3.502%203.502%200%200%201%2017%202.498zm0%2013.5a2.002%202.002%200%201%200%200%204.004%202.002%202.002%200%200%200%200-4.004zm-10.498-6a2.002%202.002%200%201%200%200%204.004%202.002%202.002%200%200%200%200-4.004zm10.498-6a2.002%202.002%200%201%200%200%204.004%202.002%202.002%200%200%200%200-4.004z%22%20fill%3D%22black%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E);
}
.start_button {
background-image: url(data:image/svg+xml,%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22m13.75%208.412%2024.417%2012.705a3.25%203.25%200%200%201%200%205.766L13.75%2039.588A3.25%203.25%200%200%201%209%2036.705v-25.41a3.25%203.25%200%200%201%204.549-2.98l.201.097zm-1.154%202.218-.11-.047a.75.75%200%200%200-.986.712v25.41a.75.75%200%200%200%201.096.665l24.417-12.705a.75.75%200%200%200%200-1.33L12.596%2010.63z%22%20fill%3D%22black%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E);
}
.pause_button {
background-image: url(data:image/svg+xml,%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M17.75%207A3.25%203.25%200%200%201%2021%2010.25v27.5A3.25%203.25%200%200%201%2017.75%2041h-5.5A3.25%203.25%200%200%201%209%2037.75v-27.5A3.25%203.25%200%200%201%2012.25%207h5.5zm18%200A3.25%203.25%200%200%201%2039%2010.25v27.5A3.25%203.25%200%200%201%2035.75%2041h-5.5A3.25%203.25%200%200%201%2027%2037.75v-27.5A3.25%203.25%200%200%201%2030.25%207h5.5zm-18%202.5h-5.5a.75.75%200%200%200-.75.75v27.5c0%20.414.336.75.75.75h5.5a.75.75%200%200%200%20.75-.75v-27.5a.75.75%200%200%200-.75-.75zm18%200h-5.5a.75.75%200%200%200-.75.75v27.5c0%20.414.336.75.75.75h5.5a.75.75%200%200%200%20.75-.75v-27.5a.75.75%200%200%200-.75-.75z%22%20fill%3D%22black%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E);
}
.stop_button {
background-image: url(data:image/svg+xml,%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M19.25%204.5a.25.25%200%200%201%20.25.25v14.5a.25.25%200%200%201-.25.25H4.75a.25.25%200%200%201-.25-.25V4.75a.25.25%200%200%201%20.25-.25h14.5zM4.75%203A1.75%201.75%200%200%200%203%204.75v14.5c0%20.966.784%201.75%201.75%201.75h14.5A1.75%201.75%200%200%200%2021%2019.25V4.75A1.75%201.75%200%200%200%2019.25%203H4.75z%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E);
}
.dropdown-menu[data-bs-popper] {
left: unset;
right: 0;
}
#sort-direction:before,
.dropdown-menu .dropdown-item:before {
content: "";
display: inline-block;
width: 24px;
height: 24px;
margin-right: 0.5rem;
background-repeat: no-repeat;
background-position-x: 0;
background-position-y: center;
background-size: contain;
transform: scale(0.8) translate(0, 8px);
}
[data-id="mySelect"]:before {
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22black%22%20class%3D%22bi%20bi-sort-alpha-up%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M10.082%205.629%209.664%207H8.598l1.789-5.332h1.234L13.402%207h-1.12l-.419-1.371zm1.57-.785L11%202.687h-.047l-.652%202.157z%22%2F%3E%3Cpath%20d%3D%22M12.96%2014H9.028v-.691l2.579-3.72v-.054H9.098v-.867h3.785v.691l-2.567%203.72v.054h2.645zm-8.46-.5a.5.5%200%200%201-1%200V3.707L2.354%204.854a.5.5%200%201%201-.708-.708l2-1.999.007-.007a.5.5%200%200%201%20.7.006l2%202a.5.5%200%201%201-.707.708L4.5%203.707z%22%2F%3E%3C%2Fsvg%3E);
}
qwe {
background-image: url(data:image/svg+xml,%3Csvg%20width%3D%2228%22%20height%3D%2228%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.22%209.967%207.97%204.22l.085-.074.058-.038.072-.039.105-.04.105-.022.052-.005L8.5%204l.057.002.092.013.107.03.085.037.054.03.063.044.072.064%205.75%205.747a.75.75%200%200%201-.976%201.134l-.084-.073L9.25%206.56v16.69a.75.75%200%200%201-1.493.102l-.007-.102V6.56l-4.47%204.468a.75.75%200%200%201-.976.072l-.084-.072a.75.75%200%200%201-.073-.977l.073-.084zM19.5%204a.75.75%200%200%201%20.743.648l.007.102v16.687l4.47-4.467.084-.073a.75.75%200%200%201%201.049%201.05l-.073.083-5.728%205.727a.748.748%200%200%201-1.031.07l-.073-.07-5.728-5.727-.073-.084a.75.75%200%200%201-.007-.882l.08-.094.084-.073a.75.75%200%200%201%20.882-.007l.094.08%204.47%204.469V4.75l.007-.102A.75.75%200%200%201%2019.5%204z%22%20fill%3D%22black%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E);
}
.dropdown-menu .dropdown-item#alphabetical:before {
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22none%22%20viewBox%3D%220%200%2014.002%2015.5%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22m5.218%2011.72-1.22%201.22V.75c0-.41-.34-.75-.75-.75s-.75.34-.75.75v12.19l-1.22-1.22a.754.754%200%200%200-1.06%200c-.29.29-.29.77%200%201.06l2.5%202.5a.78.78%200%200%200%20.53.22.776.776%200%200%200%20.53-.22l2.5-2.5c.29-.29.29-.77%200-1.06a.754.754%200%200%200-1.06%200M8.998%206.96c.39.14.82-.06.96-.45l.28-.78h2.03l.28.78c.11.31.4.5.71.5.08%200%20.17-.01.25-.04a.75.75%200%200%200%20.45-.96l-1.71-4.79c-.17-.43-.56-.71-1-.71s-.83.28-1%20.73l-1.7%204.77c-.14.39.06.82.45.96zm2.73-2.73h-.96l.48-1.34zM13.668%209.21c-.19-.44-.59-.71-1.05-.71h-3.11c-.41%200-.75.34-.75.75s.34.75.75.75h2.39l-2.83%202.95c-.34.36-.43.88-.24%201.34.19.44.59.71%201.05.71h3.13c.41%200%20.75-.34.75-.75s-.34-.75-.75-.75h-2.39l2.82-2.93c.34-.36.44-.89.24-1.35z%22%2F%3E%3C%2Fsvg%3E);
}
.dropdown-menu .dropdown-item#chronological:before {
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22800%22%20height%3D%22800%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M22%202.25h-3.25V.75a.75.75%200%200%200-1.5-.001V2.25h-4.5V.75a.75.75%200%200%200-1.5-.001V2.25h-4.5V.75a.75.75%200%200%200-1.5-.001V2.25H2a2%202%200%200%200-2%201.999v17.75a2%202%200%200%200%202%202h20a2%202%200%200%200%202-2V4.249a2%202%200%200%200-2-1.999M22.5%2022a.5.5%200%200%201-.499.5H2a.5.5%200%200%201-.5-.5V4.25a.5.5%200%200%201%20.5-.499h3.25v1.5a.75.75%200%200%200%201.5.001V3.751h4.5v1.5a.75.75%200%200%200%201.5.001V3.751h4.5v1.5a.75.75%200%200%200%201.5.001V3.751H22a.5.5%200%200%201%20.499.499z%22%2F%3E%3Cpath%20d%3D%22M5.25%209h3v2.25h-3zM5.25%2012.75h3V15h-3zM5.25%2016.5h3v2.25h-3zM10.5%2016.5h3v2.25h-3zM10.5%2012.75h3V15h-3zM10.5%209h3v2.25h-3zM15.75%2016.5h3v2.25h-3zM15.75%2012.75h3V15h-3zM15.75%209h3v2.25h-3z%22%2F%3E%3C%2Fsvg%3E);
}
.dropdown-menu .dropdown-item#duration:before {
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xml%3Aspace%3D%22preserve%22%20width%3D%22332.697%22%20height%3D%22473.068%22%3E%3Cpath%20d%3D%22M285.321%20181.955c8.793-6.139%2029.39-20.519%2029.39-55.351v-71.77h9.814c4.49%200%208.17-3.679%208.17-8.169v-38.5c0-4.49-3.681-8.165-8.17-8.165H8.165C3.67%200%200%203.675%200%208.165v38.5c0%204.491%203.67%208.169%208.165%208.169h9.82v73.071c0%2034.499%2010.502%2042.576%2029.074%2053.89l80.745%2049.203v20.984c-20.346%2012.23-73.465%2044.242-80.434%2049.107-8.793%206.135-29.384%2020.51-29.384%2055.352v61.793h-9.82c-4.495%200-8.165%203.676-8.165%208.166v38.498c0%204.49%203.67%208.17%208.165%208.17h316.361c4.49%200%208.17-3.68%208.17-8.17V426.4c0-4.49-3.681-8.166-8.17-8.166h-9.814V355.13c0-34.493-10.508-42.572-29.069-53.885l-80.745-49.202v-20.987c20.332-12.225%2073.452-44.234%2080.422-49.101M182.54%20272.859l87.802%2053.5c6.734%204.109%2010.333%206.373%2012.001%209.002%201.991%203.164%202.963%209.627%202.963%2019.768v63.104H47.388V356.44c0-19.507%209.718-26.289%2016.81-31.242%205.551-3.865%2054.402-33.389%2085.878-52.289a14.7%2014.7%200%200%200%207.135-12.611v-37.563c0-5.123-2.671-9.883-7.053-12.55l-87.54-53.339-.265-.165c-6.741-4.105-10.336-6.369-11.998-9.009-1.992-3.156-2.968-9.626-2.968-19.767v-73.07h237.918v71.77c0%2019.5-9.718%2026.288-16.814%2031.235-5.546%203.872-54.391%2033.395-85.869%2052.295a14.7%2014.7%200%200%200-7.134%2012.601v37.563a14.71%2014.71%200%200%200%207.052%2012.56%22%2F%3E%3Cpath%20d%3D%22M260.879%20154.234s5.291-4.619-2.801-3.299c-19.178%203.115-53.079%2015.133-92.079%2015.133s-57-11-82.507-11.303c-5.569-.066-5.456%203.629.937%207.391%206.386%203.758%2063.772%2035.681%2071.671%2040.08%207.896%204.389%2012.417%204.05%2020.786%200%2012.174-5.902%2083.993-48.002%2083.993-48.002M84.125%20397.564c-6.748%206.209-9.978%2010.713%205.536%2010.713h155.442c16.099%200%209.856-5.453%202.311-12.643-14.576-13.883-45.416-23.566-82.414-23.566-38.754%200-65.844%2011.655-80.875%2025.496%22%2F%3E%3C%2Fsvg%3E);
}
.dropdown-menu .dropdown-item#random:before {
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22800%22%20height%3D%22800%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20d%3D%22M0%2024q0%20.832.576%201.44t1.44.576H4q2.048%200%203.904-.8t3.168-2.144%202.144-3.2.8-3.872q0-2.464%201.728-4.224T20%2010.016h4V12q0%20.672.384%201.152t.864.704%201.12.128%201.056-.544l4-4Q32.032%208.8%2032%208t-.576-1.408l-4-4q-.48-.448-1.088-.544t-1.12.128-.864.704T24%204v2.016h-4q-2.016%200-3.872.8t-3.2%202.112-2.144%203.2T10.016%2016q0%202.496-1.76%204.256T4%2022.016H2.016q-.832%200-1.44.576T0%2024M0%208.032q0%20.832.576%201.408t1.44.576H4q1.408%200%202.592.608t2.08%201.664q.672-2.048%201.984-3.68Q7.744%206.016%204%206.016H2.016q-.832%200-1.44.608T0%208.032m13.376%2015.424q2.848%202.56%206.624%202.56h4v2.016q0%20.64.384%201.152t.864.704%201.12.096%201.056-.544l4-4q.608-.608.576-1.44t-.576-1.376l-4-4q-.48-.48-1.088-.576t-1.12.128-.864.736-.352%201.12v1.984h-4q-1.376%200-2.592-.576t-2.048-1.664q-.704%202.048-1.984%203.68%22%2F%3E%3C%2Fsvg%3E);
}
input[type="checkbox"].btn-check#btn-inverse:checked + #sort-direction.btn {
background-color: unset !important;
}
input[type="checkbox"].btn-check#btn-inverse:disabled + #sort-direction.btn {
filter: opacity(0.5);
}
input[type="checkbox"].btn-check#btn-inverse + #sort-direction.btn:before {
margin-right: unset;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
input[type="checkbox"].btn-check#btn-inverse + #sort-direction.btn:before {
width: 20px;
height: 20px;
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xml%3Aspace%3D%22preserve%22%20viewBox%3D%220%200%20301.219%20301.219%22%3E%3Cpath%20d%3D%22M149.365%20262.736H10c-5.523%200-10%204.477-10%2010v10c0%205.523%204.477%2010%2010%2010h139.365c5.522%200%2010-4.477%2010-10v-10c0-5.523-4.477-10-10-10M10%20229.736h120.586c5.522%200%2010-4.477%2010-10v-10c0-5.523-4.478-10-10-10H10c-5.523%200-10%204.477-10%2010v10c0%205.523%204.477%2010%2010%2010M10%20166.736h101.805c5.522%200%2010-4.477%2010-10v-10c0-5.523-4.478-10-10-10H10c-5.523%200-10%204.477-10%2010v10c0%205.523%204.477%2010%2010%2010M10%2096.736h83.025c5.522%200%2010-4.477%2010-10v-10c0-5.523-4.478-10-10-10H10c-5.523%200-10%204.477-10%2010v10c0%205.523%204.477%2010%2010%2010M10%2033.736h64.244c5.522%200%2010-4.477%2010-10v-10c0-5.523-4.478-10-10-10H10c-5.523%200-10%204.477-10%2010v10c0%205.523%204.477%2010%2010%2010M298.29%20216.877l-7.07-7.071a10%2010%200%200%200-14.142%200l-34.394%2034.393V18.736c0-5.523-4.477-10-10-10h-10c-5.522%200-10%204.477-10%2010v225.462l-34.394-34.393a10%2010%200%200%200-14.142%200l-7.07%207.071c-3.905%203.905-3.905%2010.237%200%2014.142l63.535%2063.536a10.003%2010.003%200%200%200%2014.142%200l63.535-63.536c3.905-3.905%203.905-10.236%200-14.141%22%2F%3E%3C%2Fsvg%3E);
}
input[type="checkbox"].btn-check#btn-inverse:checked
+ #sort-direction.btn:before {
background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xml%3Aspace%3D%22preserve%22%20viewBox%3D%220%200%20301.219%20301.219%22%3E%3Cpath%20d%3D%22M159.365%2023.736v-10c0-5.523-4.477-10-10-10H10c-5.523%200-10%204.477-10%2010v10c0%205.523%204.477%2010%2010%2010h139.365c5.523%200%2010-4.477%2010-10M130.586%2066.736H10c-5.523%200-10%204.477-10%2010v10c0%205.523%204.477%2010%2010%2010h120.586c5.523%200%2010-4.477%2010-10v-10c0-5.523-4.477-10-10-10M111.805%20129.736H10c-5.523%200-10%204.477-10%2010v10c0%205.523%204.477%2010%2010%2010h101.805c5.523%200%2010-4.477%2010-10v-10c0-5.523-4.477-10-10-10M93.025%20199.736H10c-5.523%200-10%204.477-10%2010v10c0%205.523%204.477%2010%2010%2010h83.025c5.522%200%2010-4.477%2010-10v-10c0-5.523-4.477-10-10-10M74.244%20262.736H10c-5.523%200-10%204.477-10%2010v10c0%205.523%204.477%2010%2010%2010h64.244c5.522%200%2010-4.477%2010-10v-10c0-5.523-4.477-10-10-10M298.29%20216.877l-7.071-7.071a10%2010%200%200%200-14.143%200l-34.393%2034.393V18.736c0-5.523-4.477-10-10-10h-10c-5.523%200-10%204.477-10%2010v225.462l-34.393-34.393a10.003%2010.003%200%200%200-14.142%200l-7.072%207.071c-3.904%203.905-3.904%2010.237%200%2014.142l63.536%2063.536a9.97%209.97%200%200%200%207.071%202.929%209.97%209.97%200%200%200%207.071-2.929l63.536-63.536c3.905-3.905%203.905-10.237%200-14.141%22%2F%3E%3C%2Fsvg%3E);
}
.dropup .dropdown-toggle::after {
content: none;
}
.dropup .dropdown-toggle::before {
display: inline-block;
margin-right: 0.255em;
vertical-align: 0.255em;
content: "";
border-top: 0;
border-right: 0.3em solid transparent;
border-bottom: 0.3em solid;
border-left: 0.3em solid transparent;
}