@charset "UTF-8";

@font-face {
font-family : "Caslon Ionic Web Regular Regular";
src : url("../fonts/312bc9a47884bcb79a743e8cc6c357cf.eot");
src : url("../fonts/312bc9a47884bcb79a743e8cc6c357cf.eot?#iefix") format("embedded-opentype"), url("../fonts/312bc9a47884bcb79a743e8cc6c357cf.woff2") format("woff2"), url("../fonts/312bc9a47884bcb79a743e8cc6c357cf.woff") format("woff"), url("../fonts/312bc9a47884bcb79a743e8cc6c357cf.ttf") format("truetype"), url("../fonts/312bc9a47884bcb79a743e8cc6c357cf.svg#Caslon Ionic Web Regular Regular") format("svg");
}
html, body {
margin : 0;
height : 100%;
overflow-x : hidden;
}
body {
overflow-x : hidden;
}
html {
scroll-behavior : smooth;
}
body {
padding : 0;
margin : 0;
background-color : #bab3ab;
color : #ece7e2;
font-family : "Caslon Ionic Web Regular Regular";
font-weight : 700;
line-height : 135%;
letter-spacing : 0.5px;
font-size : 12px;
background-image: url("../2023-music-img/bg2.gif");
background-attachment: fixed;
}
.layer{position:fixed;left:0;right:0;top:0;bottom:0;opacity:0.3;background: linear-gradient(44deg, #e91e63, #fffde7);z-index:0;}
.framer {
border:none;
width:100%;
height:90vh;
}
.section {
height : 100vh;
width : 100vw;
position : absolute;
z-index : 1;
}
#section0 {
top : 0;
}
#section1 {
top : 100vh;
}
#section2 {
top : 200vh;
}
#section3 {
top : 300vh;
}
#section4 {
top : 400vh;
}
#section5 {
top : 500vh;
}
#section6 {
top : 600vh;
}
#extra {
top : 700vh;
z-index : 3;
background: #b8b2ac;
height:auto;
}
.topsection {
margin-top : 36px;
height : 26vmin;
min-height : 140px;
}
.navbar ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
position : fixed;
background : #59534d;
width : 100vw;
top : 0;
height : 36px;
z-index : 2000;
}
.navbar img {
height : 28px;
padding : 4px 0 4px 0;
margin : 0 -4px 0 -4px;
}
.navbar li {
float: right;
}
.navbar li a {
display: block;
color : #dad2c9;
text-align: right;
line-height:36px;
text-decoration: none;
margin-right : 10px;
}
.padder {
display:block;
padding:8px;
}
#insta {
height : 20px;
padding : 8px 0 8px 0;
}
.topholder {
position : fixed;
margin-top : 30px;
top : 3vmin;
left : 3vmin;
z-index : 2;
text-transform : uppercase;
}
.topholder h1, h2 {


padding : 0 0 4px 0;
margin : 0;
color: #59534d;
}
.subnav {
position : relative;
top : 50%;
transform : translateY(-50%);
text-align : right;
color : #59534d;
margin : 0 3vmin 0 0;
text-transform : uppercase;
}
.subnav a {
display : block;
padding : 6px 0 6px 0;
}
.subnav span {
display : block;
text-transform : capitalize;
padding-top : 4px;
}
.subnav img {
width : 30px;
height : auto;
padding : 4px 0 4px 0;
}
.content2 {
max-width : 600px;
margin : 0 auto 0 auto;
min-height : 100vh;
color : #59534d;
padding: 6vmin;
}
.content2 a {
color : #a3605b;
text-decoration:none;
}
.content2 h3 {
margin: 0 0 20px 0;
font-size: 1.25em;
	display:block;
}
.content2 p {
min-height:80px;
}
.content2 img {
width: 7vmin;
height: auto;
margin: 4px 20px 8px 0;
float: left;
min-width: 80px;
filter: grayscale(50%);
}
#biopic {
width: calc(14vmin + 20px);
height: auto;
margin: 4px 20px 8px 0;
float: left;
min-width: 80px;
filter: grayscale(0%);
}
.breaker{display:none;}
.footer{padding-top:6vmin;}
@media only screen and (max-width: 480px) {
body {font-size : 10px;}
.topsection {height : 50vmin;}
.topnav {height : 30px;}
.topnav div {line-height : 30px;}
.topnav img {height : 20px;padding : 5px;}
.topholder {margin-top: 20px;}
.topholder h1 {font-size:16px;line-height:20px;}
.subnav {font-size: 12px;line-height:10px;}
.breaker{display:block;}
.padder {display:none;}
}
@media only screen and (max-width: 600px) {
body {font-size : 11px;}
.topsection {height : 50vmin;}
.topnav {height : 32px;}
.topnav div {line-height : 32px;}
.topnav img {height : 22px;padding : 5px;}
.topholder {margin-top: 32px;}
.topholder h1 {font-size:17px;line-height:21px;}
.subnav {font-size: 13px;line-height:11px;}
.breaker{display:block;}
.padder {display:none;}
}
@media only screen and (min-width: 600px) {
body {font-size : 11px;}
.topsection {height : 30vmin;}
.topnav {height : 34px;}
.topnav div {line-height : 34px;}
.topnav img {height : 24px;padding : 5px;}
.topholder {margin-top: 34px;}
.topholder h1 {font-size:18px;line-height:22px;}
.subnav {font-size: 14px;line-height:12px;}
.breaker{display:none;}
.padder {display:none;}
}
@media only screen and (min-width: 768px) {
body {font-size : 11px;}
.topnav {height : 34px;}
.topnav div {line-height : 34px;}
.topnav img {height : 24px;padding : 5px;}
.topholder {margin-top: 34px;}
.topholder h1 {font-size:18px;line-height:22px;}
.subnav {font-size: 14px;line-height:12px;}
.breaker{display:none;}
.padder {display:none;}
}
@media only screen and (min-width: 992px) {
body {font-size : 12px;}
.topnav {height : 34px;}
.topnav div {line-height : 34px;}
.topnav img {height : 24px;padding : 5px;}
.topholder {margin-top: 34px;}
.topholder h1 {font-size:20px;line-height:24px;}
.subnav {font-size: 16px;line-height:14px;}
.breaker{display:none;}
.padder {display:none;}
}
@media only screen and (min-width: 1200px) {
body {font-size : 12px;}
.topnav {height : 34px;}
.topnav div {line-height : 34px;}
.topnav img {height : 24px;padding : 5px;}
.topholder {margin-top: 34px;}
.topholder h1 {font-size:24px;line-height:28px;}
.subnav {font-size: 18px;line-height:16px;}
.breaker{display:none;}
.padder {display:block;}
}