* {
	scrollbar-width: thin;
	scrollbar-color: #ffffff #131313;
}

/* Chrome, Edge and Safari */
*::-webkit-scrollbar {
	height: 10px;
	width: 6px;
}
*::-webkit-scrollbar-track {
	border-radius: 7px;
	background-color: #131313;
}

*::-webkit-scrollbar-track:hover {
	background-color: #131313;
}

*::-webkit-scrollbar-track:active {
	background-color: #131313;
}

*::-webkit-scrollbar-thumb {
	border-radius: 3px;
	background-color: #ffffff;
}

*::-webkit-scrollbar-thumb:hover {
	background-color: #f2f2f2;
}

*::-webkit-scrollbar-thumb:active {
	background-color: #f2f2f2;
}

html,
body {
	background-color: #131313;
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	overflow-x: hidden;
	font-family: "Crimson Text", serif;
	color: white;
}

#header-image {
	border-radius: 50%;
	height: 500px;
	width: 500px;
	border: 3px solid white;
	padding: 25px;
}

.title {
	font-size: 110px;
	margin-bottom: 60px;
}

.headers {
	font-size: 45px;
	margin-top: 120px;
}

.paragraphs {
	font-size: 22px;
}

.quote {
	font-size: 22px;
	margin-top: 100px;
	margin-bottom: 120px;
}

.social-button {
	width: 70px;
	height: 70px;
	margin: 10px;
	color: #131313;
	overflow: hidden;
	position: relative;
	border-radius: 30%;
	background: #f1f1f1;
	text-decoration: none !important;
	box-shadow: 0 5px 15px -5px #00000070;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.social-button i {
	font-size: 30px;
	transition: 0.2s linear;
}

.social-button:before {
	content: "";
	width: 120%;
	height: 120%;
	left: -110%;
	top: 90%;
	position: absolute;
	transform: rotate(45deg);
}

.social-button:hover i {
	color: #f1f1f1;
	transform: scale(1.3);
}

#facebook-icon:before {
	background: #3b5998;
}

#instagram-icon:before {
	background-image: radial-gradient(circle farthest-corner at 10% 20%, #56ccf2 0%, #fb3958 100%);
}

#bluesky-icon:before {
	background: #0085ff;
}

#soundcloud-icon:before {
	background: #f80;
}

.social-button:hover:before {
	top: -10%;
	left: -10%;
	-webkit-animation: socials 0.7s 1;
	animation: socials 0.7s 1;
}

@-webkit-keyframes socials {
	0% {
		top: 90%;
		left: -110%;
	}
	50% {
		top: -30%;
		left: 10%;
	}
	100% {
		top: -10%;
		left: -10%;
	}
}

@keyframes socials {
	0% {
		top: 90%;
		left: -110%;
	}
	50% {
		top: -30%;
		left: 10%;
	}
	100% {
		top: -10%;
		left: -10%;
	}
}

.soundcloud-embed {
	font-size: 10px;
	color: #cccccc;
	line-break: anywhere;
	word-break: normal;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-family: Interstate, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Garuda, Verdana, Tahoma, sans-serif;
	font-weight: 100;
}

.long-thematic-break {
	width: 700px;
	border-bottom: 2px solid #c5c5c5;
	margin-bottom: 40px;
}

.short-thematic-break {
	width: 130px;
	border-bottom: 2px solid #c5c5c5;
	margin-bottom: 40px;
}

.section {
	margin-bottom: 150px;
}

.swiper-container {
	width: 100%;
	height: 100%;
}

.swiper-slide img {
	width: 80%;
	height: 100%;
	object-fit: contain;
}

.photo-swiper {
	margin-left: auto;
	margin-right: auto;
	width: 90vw;
	height: 580px;
}

footer {
	color: black;
	background-color: whitesmoke;
	border-top: 3px solid grey;
	padding-top: 10px;
}

.footer-title {
	color: black;
	font-size: 70px;
}

.last-section {
	margin-bottom: 75px;
}

#contact-link:hover {
	text-decoration: dotted;
}

.shows {
	font-size: 30px;
}

.video-prev,
.video-next {
	position: absolute;
	top: 50%;
	width: calc(var(--swiper-navigation-size) / 44 * 27);
	height: var(--swiper-navigation-size);
	margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
	z-index: 10;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
}

.swiper-button-prev,
.swiper-button-next {
	color: white !important;
}

.video-prev:after,
.swiper-container-rtl .video-next:after {
	content: "prev";
}

.video-next:after,
.swiper-container-rtl .video-prev:after {
	content: "next";
}

.video-next:after,
.video-prev:after {
	font-family: swiper-icons;
	font-size: var(--swiper-navigation-size);
	text-transform: none !important;
	letter-spacing: 0;
	text-transform: none;
	font-variant: initial;
	line-height: 1;
}

.video-prev,
.swiper-container-rtl .video-next {
	left: 10px;
	right: auto;
}

.video-next,
.swiper-container-rtl .video-prev {
	right: 10px;
	left: auto;
}

#rights-container {
	padding-right: 20px;
}

#copyright-container {
	padding-left: 20px;
}

@media screen and (max-width: 350px) {
	#header-image {
		padding: 12px;
	}

	.video-next,
	.video-prev {
		display: none;
	}

	.video-swiper .swiper-wrapper > div:not(:nth-last-child(1)) {
		display: none;
	}
}

@media screen and (max-width: 300px) {
	.title {
		font-size: 50px;
	}

	#header-image {
		height: 240px;
		width: 240px;
	}

	.headers {
		font-size: 20px;
	}

	.paragraphs,
	.shows,
	.quote {
		font-size: 16px;
	}

	#contact-link {
		font-size: 14px;
	}
}

@media screen and (max-width: 499px) {
	.video-container iframe {
		width: 250px;
		height: 200px;
	}
}

@media screen and (min-width: 301px) and (max-width: 350px) {
	.title {
		font-size: 55px;
	}

	#header-image {
		height: 260px;
		width: 260px;
	}

	.headers {
		font-size: 22px;
	}

	#contact-link {
		font-size: 16px;
	}

	.shows,
	.paragraphs,
	.quote {
		font-size: 18px;
	}
}

@media screen and (min-width: 351px) and (max-width: 499px) {
	.title {
		font-size: 68px;
	}

	#header-image {
		height: 300px;
		width: 300px;
		padding: 14px;
	}

	.video-prev,
	.swiper-container-rtl .video-next {
		left: 4px;
	}

	.video-next,
	.swiper-container-rtl .video-prev {
		right: 4px;
	}

	.headers {
		font-size: 27px;
	}

	.shows,
	.paragraphs,
	.quote {
		font-size: 18px;
	}
}

@media screen and (min-width: 500px) and (max-width: 768px) {
	.title {
		font-size: 90px;
	}

	#header-image {
		height: 380px;
		width: 380px;
		padding: 15px;
	}

	.video-container iframe {
		width: 370px;
		height: 300px;
	}

	.headers {
		font-size: 40px;
	}

	.quote {
		font-size: 18px;
	}

	.shows,
	.paragraphs {
		font-size: 21px;
	}
}

@media screen and (max-width: 768px) {
	.long-thematic-break {
		width: 100%;
	}

	.short-thematic-break {
		width: 40%;
	}

	#soundcloud-iframe {
		width: 100%;
		height: 350px;
	}

	.swiper-slide img {
		width: 70%;
	}

	.photo-swiper {
		height: 280px;
	}

	.section {
		margin-bottom: 100px;
	}

	#rights-container {
		order: 3;
		text-align: center !important;
		padding-right: 0 !important;
		align-self: auto !important;
	}

	#copyright-container {
		order: 2;
		text-align: center !important;
		padding-left: 0 !important;
		align-self: auto !important;
	}

	#footer-container {
		justify-content: center !important;
		flex-direction: column;
	}

	.social-button {
		width: 55px;
		height: 55px;
	}
}

@media screen and (min-width: 769px) and (max-width: 850px) {
	.video-container iframe {
		width: 600px;
	}

	.shows,
	.paragraphs {
		font-size: 22px;
	}
}
