@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css);

body {
    -webkit-font-smoothing: antialiased;
	font-display: swap;
}
a {
    text-decoration: none;
}
ul {
    padding:0;
    list-style: none;
}
.header-social-icons {
    width: 100vw;
    display: block;
    margin: auto;
	text-align: right;
	vertical-align: middle;
	margin-bottom: 1vw;
	margin-top: -0.5vh;
	margin-left: -0.65vw;
	border-bottom: 0vw solid rgba(255, 255, 255, 100%);
	border-top: 0vw solid rgba(255, 255, 255, 0%);
}
.social-icon {
	position: relative;
	margin: 0px;
	margin-top: 1vw;
	margin-bottom: 1vw;
	margin-right: 2vw;
	font-size: 3vw;
	z-index: 9999;
}
ul.social-icons {
    margin-top: 1vh;
}
.social-icons li {
    vertical-align: top;
    display: inline;
}
.social-icons a {
    color: #fff;
    text-decoration: none;
}
.fa-facebook-f {
    padding: 0.5vw 0.5vw;
	text-align: left;
	width: 2.45vw;
}
.fa-facebook-f:hover {
	background: #3d5b99;
	border-radius: 1vw;
	margin-left: -0.2vw;
}
.fa-twitter {
    padding: 0.5vw 0.5vw;
	text-align: left;
	width: 3.45vw;
}
.fa-twitter:hover {
    background: #00aced;
	border-radius: 1vw;
}
.fa-youtube {
    padding: 0.5vw 0.5vw;
	text-align: left;
	width: 4.1vw;
}
.fa-youtube:hover {
    background: #e64a41;
	border-radius: 1vw;
}
.fa-spotify {
    padding: 0.5vw 0.5vw;
	text-align: left;
	width: 3.5vw;
}
.fa-spotify:hover {
    background: #1DB954;
	border-radius: 1vw;
}
.fa-bandcamp {
    padding: 0.5vw 0.5vw;
	text-align: left;
	width: 3.5vw;
}
.fa-bandcamp:hover {
    background: #629aa9;
	border-radius: 1vw;
}
.fa-itunes-note {
    padding: 0.5vw 0.5vw;
	text-align: left;
	width: 3vw;
}
.fa-itunes-note:hover {
	background: #ff6932;
	background: -webkit-linear-gradient(-45deg, #ff6932 20%, #d600fc 50%, #3cf2fc 80%);
	border-radius: 1vw;
}
.fa-instagram {
    padding: 0.5vw 0.5vw;
	text-align: left;
	width: 3.25vw;
}
.fa-instagram:hover {
	background: #d6249f;
	background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);
	border-radius: 1vw;
}
.fa-soundcloud {
    padding: 0.5vw 0.5vw;
	text-align: left;
	width: 4.75vw;
}
.fa-soundcloud:hover {
	background: #FE5000;
	border-radius: 1vw;
}
.fa-amazon {
    padding: 0.5vw 0.5vw;
	text-align: left;
	width: 3.25vw;
}
.fa-amazon:hover {
    background: #FF9900;
	border-radius: 1vw;
}
.fa-bars {
	float: left;
	display: block;
	text-align: center;
	position: relative;
	margin-right: -2vw;
	padding-bottom: 1vw;
	font-size: 3.75vw;
}
.fa-bars:hover {
	margin-bottom: -1vw;
}
.fa-bars:active {
}

svg {
  border:0px;
  padding:0 10vw;
  overflow:visible;
  margin-top: 15%;
  max-width: 75%;
  box-sizing:border-box;
}

.svg2 {
  padding:10px;
}

.svg3 {
  padding:0px;
}

.resize{
  resize:both;
  overflow:auto;
  padding:1em;
  border:1px solid #ccc;
}

div.square{
	width:25vw;
	height:25vw;
	margin-left:auto;
	margin-right:auto;
	-webkit-animation:rescale 4s infinite;
	animation: rescale 4s infinite;
	position:sticky;
	margin-top: -17vw;
	z-index: -1;
}

div.square2{
	width:25vw;
	height:25vw;
	margin-left:auto;
	margin-right:auto;
	-webkit-animation:rescale2 4s infinite;
	animation: rescale2 4s infinite;
	position:sticky;
	margin-top: -17vw;
	z-index: -1;
}

@-webkit-keyframes rescale{
  0% {transform:rotate(0deg);}
  10% {transform:rotate(36deg);}
  20% {transform:rotate(72deg);}
  30% {transform:rotate(108deg);}
  40% {transform:rotate(144deg);}
  50% {transform:rotate(180deg);}
  60% {transform:rotate(216deg);}
  70% {transform:rotate(252deg);}
  80% {transform:rotate(288deg);}
  90% {transform:rotate(334deg);}
  100% {transform:rotate(360deg);}
}

@keyframes rescale{
  0% {transform:rotate(0deg);}
  10% {transform:rotate(36deg);}
  20% {transform:rotate(72deg);}
  30% {transform:rotate(108deg);}
  40% {transform:rotate(144deg);}
  50% {transform:rotate(180deg);}
  60% {transform:rotate(216deg);}
  70% {transform:rotate(252deg);}
  80% {transform:rotate(288deg);}
  90% {transform:rotate(334deg);}
  100% {transform:rotate(360deg);}
}

@-webkit-keyframes rescale2{
  0% {transform:rotate(360deg);}
  10% {transform:rotate(334deg);}
  20% {transform:rotate(288deg);}
  30% {transform:rotate(252deg);}
  40% {transform:rotate(216deg);}
  50% {transform:rotate(180deg);}
  60% {transform:rotate(144deg);}
  70% {transform:rotate(108deg);}
  80% {transform:rotate(72deg);}
  90% {transform:rotate(36deg);}
  100% {transform:rotate(0deg);}
}

@keyframes rescale2{
  0% {transform:rotate(360deg);}
  10% {transform:rotate(334deg);}
  20% {transform:rotate(288deg);}
  30% {transform:rotate(252deg);}
  40% {transform:rotate(216deg);}
  50% {transform:rotate(180deg);}
  60% {transform:rotate(144deg);}
  70% {transform:rotate(108deg);}
  80% {transform:rotate(72deg);}
  90% {transform:rotate(36deg);}
  100% {transform:rotate(0deg);}
}

.border-gradient {
  border: 0.4px solid;
  border-image-slice: 1;
  border-width: 0.4vw;
  -webkit-text-stroke: 1px black;
}
.border-gradient-purple {
  border-image-source: -webkit-linear-gradient(90deg, rgba(18,214,223,1) 35%, rgba(247,15,255,1) 65%);
}
button {
  background: none;
  text-decoration: inherit;
  font-family: Cinzel;
  font-size: 10vw;
  color: white;
  text-align: center;
  padding: 0;
  width:25vw;
  height:25vw;
  margin:auto;
}