@font-face {
    font-family: "Merchant Copy";
    font-style: normal;
    font-weight: normal;
    src: url("Merchant Copy.ttf");
}

@font-face {
    font-family: "nerdropol";
    font-style: normal;
    font-weight: normal;
    src: url("nerdropol.otf");
}


.recordinfo a:hover,
.info a:hover,
.nav a:hover {
    color: #aaa694;
    background: #13008f;
}

a:hover {
    color: #aaa694;
    background: #13008f;
}
a {
    outline: none;
}
.nav-inner {
    border-bottom: 1px solid #13008f;
}
.info a,
.nav a {
    text-decoration: none;
    color: inherit;
}
.nav {
    padding-bottom: 10px;
}
body {
    background: #aaa694;
    color: #13008f;
    font-family: Merchant Copy;
}

.subtitle{
padding-left:20px;

}
.main {
    padding-top: 10px;
    padding-left: 20px;
    border: #13008f 1px solid;
}
#title {
    font-family: nerdropol;
}

.artistblock {
    padding-top: 20px;
}
.artistimage {
    padding-left: 10px;
}

.recordlist {
    padding-top: 20px;

    padding-left: 20px;
}

.recordinfo a {
    text-decoration: none;
    color: inherit;
}
.artistinfo {
    display: flex;
}
.recordimage {
    padding-top: 20px;
    padding-left: 20px;
}

.record,
.submit,
.artistblock {
    width: fit-content;
    border: #13008f 1px solid;
    display: flex;
    padding-left: 10px;
    padding-right: 10px;

    overflow: hidden;
}

.submit,
.artistblock {
    padding-top: 10px;
}

.recordlist {
    padding-top: 20px;
    padding-left: 20px;
    display: flex;
    gap: 10px;
    flex-flow: row wrap;

    align-items: strech;
}

.record {
    width: 250px;
    height: 160px;
    border: #13008f 1px solid;
    padding: 10px;
    flex-basis: auto;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 20px;
    overflow: scroll;
}

.recordinfo {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 4px;
}

.recordinfo p,
.recordinfo h3,
.recordinfo a {
    margin: 0;
}

.recordimage {
    padding: 0;
    flex-shrink: 0;
}
img:hover {
	animation-iteration-count: infinite;
	animation-name: head3;
	animation-duration: 1s;
}

@keyframes head3 {
	0% {
		transform: translateY(-5px);
	}
	50% {
		transform: translateY(-5px);
	}
	100% {
		transform: translateY(-5px);
	}
}