@import url("https://use.typekit.net/lgf7zsu.css");

html {
	background: #f6f6f6;
}
body {
	font-family: dolly-new, sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 20px;
	line-height: 1.5;
	width: 80%;
	max-width: 50em;
	margin: 0 auto;
}

h1 {
	text-align: left;
	margin: 0 0 2rem 0;
}

h1 cite {
	display: block;
}

#release h1 {
	font-size: 1em;
	margin-bottom: 2rem;
}

strong {
	font-weight: 700;
}

a, #release-list footer a {
	color: #000;
	text-decoration: none;
	display: inline-block;
	line-height: .9;
	border-bottom: .075em solid #00F;
	text-shadow: 1px 1px #f6f6f6, 1px -1px #f6f6f6, -1px 1px #f6f6f6, -1px -1px #f6f6f6;
}

.b {
	color: #00F;
}

.bt {
	color:rgba(0,0,255,.25);
}

.w {
	color: #fff;
}

.r {
	color: #900;
	font-weight: 700;
}

.soldout {
	color: #FFF;
	background: #00F;
	padding: 0 .25em;
	white-space: nowrap;
}

h1, h2 {
	margin: 0;
}

h2 {
	font-size: 1em;
	margin-bottom: 1em;
}

p {
	margin: 0 0 1em 0;
}

ul, ol {
	padding: 0;
	margin: 0 0 1em 0;
	list-style-position: inside;
}

#release img.logo {
	max-width: 150px;
	max-height: 100px;
	width: auto;
	height: auto;
	margin-right: 1em;
	vertical-align: top;
}

hr {
	border-top: 1rem solid #FFF;
	border-left: none;
	margin: 1em 0;
}

/* NAV */

nav {
	text-align: left;
	margin-top: 2rem;
	font-size: 1.5rem;
	padding-bottom: 2em;
	border-bottom: 1rem solid #FFF;
	color: #00f;
}

nav a {
	color: #000;
	text-decoration: none;
	display: inline-block;
	line-height: .9;
}

nav a.selected, #release-list nav a.selected {
	border-bottom: .075em solid #00F;
}

nav a:hover {
	color: #00F;
}

nav img {
	width: 1.5em;
	vertical-align: middle;
	margin-right: 1em;
}

#search {
	width:100%;
	border-top: 1rem solid #FFF;
	margin-top: 2em;
	padding-top: 1.5em;
	display: none;
}

#search:target {
	display: block;
}

#search iframe {
	overflow:hidden;
	border: none;
	margin:0;
	padding:0;
	width:308px;
	height:40px;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
}

/* HOME */

#home ul, #release-list ul {
	font-size: 0;
	list-style: none;
	margin-top: 3rem;
}

#home li, #release-list li {
	display: inline-block;
	width: calc((100% / 3) - (2rem / 3));
	aspect-ratio: 1/1;
	position: relative;
	font-size: 0;
	display: inline-block;
	text-align: center;
	margin-bottom: 1rem;
	margin-right: 1rem;
}

#home li:nth-child(1), #home li:nth-child(2) {
	width: calc(50% - .5rem);
}

#home li:nth-child(3n + 2), #home li:nth-child(2), #release-list li:nth-child(3n) {
	margin-right: 0;
}

#home li img, #release-list li img {
	width: 100%;
	height: 100%;
}


#home li p + p, #release-list li p + p {
	background: #00F;
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	font-size: 1.5rem;
	font-weight: 700;
	opacity: 0;
}

#home li p + p:hover, #release-list li p + p:hover {
	animation: cover-text-in .25s;
	opacity: 1;
}

.blurb {
	color: #00F;
	font-size: 1.5rem;
}

@keyframes cover-text-in {
	from {opacity: 0;}
	to {opacity: 1;}
}

#home li p + p a, #release-list li p + p a {
	color: #FFF;
	text-decoration: none;
	width: 100%;
	height: 100%;
	font-style: normal;
	display: inline-block;
}

#home li span, #release-list li span {
	position: absolute;
	width: 90%;
	left: 5%;
	top: 50%;
	transform: translateY(-50%);
}

#home li p + p cite, #release-list li p + p cite {
	font-weight: 400;
	display: block;
}

nav .homesig:before {
	content:" — ";
}

/* RELEASES */

#release .cover, #artist .cover {
	width: 49%;
	display: inline-block;
	vertical-align: top;
}

#release .data, #artist .data {
	display: inline-block;
	width: calc(50% - 1em);
	padding-left: 1em;
	font-size: 1.5rem;
}

#release .data h2 {
	margin: 2rem 0 0 0;
}

#release .data p {
	margin: 0;
}

#release .data iframe {
	margin-bottom: 1rem;
}

#release .cover img, #artist .cover img {
	width: 100%;
}

#release section, #release-list section {
	margin-top: 3rem;
}

#release section + section {
	border-top: 1rem solid #FFF;
	padding-top: 1rem;
	margin-top: 1rem;
}

#release ol {
	margin-top: 2rem;
	padding: 0 0 0 1.7em;
}

#release h2 + ol {
	margin-top: 0;
}

#release ol li {
	list-style-type: decimal-leading-zero;
	list-style-position: outside;
}

#release ol li::marker {
	color:#00F;
}

#release ul {
	list-style: initial;
	padding-left: 1em;
	list-style-type: "–  ";
}

#release ul li::marker {
	color:#00F;
}

#release section img, #about section img, #contact section img, #cronicaster section img, #futuronica section img {
	width: 50%;
}

#release img.full {
	width: 100%;
}

#cronicaster ::marker, li .download {
	font-weight: 700;
}

#cronicaster li {
	margin-top: 1em;
}

#cronicaster li p {
	margin-bottom: 0;
}

/* ARTISTS */

#artist-list section, #artist section, #about section, #contact section, #cronicaster section, #futuronica section {
	margin-top: 3rem;
}

#artist-list section ul {
	font-size: 1.5rem;
	list-style: none;
}

#artist-list section li {
	display: inline;
	margin-right: 1em;
}

#artist h1 {
	margin-bottom: 1em;
}

#artist section .data:first-child {
	display: block;
	width: 100%;
	padding-left: 0;
	font-size: 1.5rem;
}

#artist #release-list {
	border-top: 1rem solid #FFF;
	padding-top: 2rem;
}

#artist #release-list, #artist #release-list ul {
	margin-top: 0;
}

#release-list a, nav a, #home nav + ul a {
	border: none;
	text-shadow: none;
	line-height: 1.25;
}

nav a {
	line-height: .9;
}

#artist .data h1 {
	line-height: .9;
}



/* #artist .cover {
	width: 50%;
	margin-right: 1em;
}

#artist .cover img {
	width: 100%;
}

#artist .data {

} */

#artist #release-list {
	margin-top: 1rem;
}

/* FOOTER */

footer {
	width: 100%;
	text-align: left;
	border-top: 1rem solid #FFF;
	padding-top: 1rem;
	position: relative;
	margin-bottom: 2em;
}

footer iframe {
	vertical-align: middle;
	transform: translateY(-4px);
	position: absolute;
	right: 0;
}

/* MOBILE */

@media screen and (max-width: 380px) {
	html {
		font-size: 15px;
	}

}

@media screen and (min-width: 381px) and (max-width: 500px) {

	html {
		font-size: 16px;
		}

}

@media screen and (max-width: 500px) {

	body {
		/* font-size: 16px; */
		width: 90%;
		margin: 0 auto;
	}
	
	nav img {
		margin-right: .5em;
	}
	
	nav .logo {
		display: block;
	}
	
	nav .b, nav .bt {
		display: none;
	}
	
	nav a:nth-child(3) {
		margin-left: 2em;
	}
	
	nav .homesig {
		margin-left: 2em;
		display: inline-block;
	}
	
	nav .homesig:before {
		content: none;
	}

	
	footer iframe {
		position: relative;
		transform: translate(-8px,5px);
	}
	
	#home li, #release-list li, #home li:nth-child(1), #home li:nth-child(2) {
		width: 100%;	
		margin-right: 0;
	}
	
	#artist .cover, #artist .data, #release .cover, #release .data {
		width: 100%;
		padding-left: 0;
	}
	
	#artist-list section li {
		display: block;
	}
	
	h1 {
		margin-top: 1em;
	}
	
	#release section img, #about section img, #contact section img, #cronicaster section img, #futuronica section img {
		width: 100%;
	}

}

@media screen and (min-width: 501px) and (max-width: 780px) {
	#home li, #release-list li, #home li:nth-child(1), #home li:nth-child(2) {
		width: calc(50% - .5rem);
		margin-right: 1rem;
	}

	#release-list li:nth-child(2n + 1), #home li:nth-child(3n + 2) {
		margin-right: 1rem;
	}
	
	#release-list li:nth-child(2n) {
		margin-right: 0;
	}
	
	#home li:nth-child(2n) {
		margin-right: 0;
	}
	
	#home li:nth-child(11) {
		display: none;
	}
	
	nav .b, nav .bt {
		display: none;
	}
	
}