body {
	background-image: url('/img/desert-bw.jpg');
	background-size: 100%;
	background-position-y: -10px;
}
h1,h2,h3,h4 {
	font-family: Bebas;
}
.song-background {
	background-color: #004A55;
}
.svg-icon {
	margin:0px 15px;
	width: 32px;
	height: 32px;
}
.icon-filter {
	filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(45deg) brightness(106%) contrast(102%);
}
.go-home:hover {
	text-decoration: none !important;
}
.menu {
	margin: 20px 0px;
    font-family: PlexSans;
    font-size: 18px;
    letter-spacing: 2px;
}
.menu-item {
	color: black;
}
.menu-item:hover {
	opacity: 0.4;
	text-decoration: none;
	color: black;
	cursor: pointer;
}
.svg-icon:hover {
	opacity: 0.4;
	cursor: pointer;
}
.icons {
/*	margin: 20px 0px;*/
	padding-top: 10px;
	color:white;
}
#mc_embed_signup {
	border: 3px #004A55 solid;
    border-radius: 7px;
    padding: 28px;
    width:600px;
    margin:auto;
}
#mc-embedded-subscribe {
	background-color:#004A55 !important; 
	width: 120px !important; 
	height: 42px !Important;
}
.email-list-caption {
	font-family: 'PlexSans';
    font-size: 15px;
    line-height: 25px;
}
.footer {
	background-color: #004A55 !important;
    position: fixed;
    width: 100%;
    bottom: 0px;
}
@media only screen and (max-width: 840px) {
	body {
		background-image: url('/img/desert-bw-mobile.jpg');
/*		background-position-y: -20px;*/
/*		background-position-x: -60px;*/
	}
	#mc_embed_signup {
		width: 400px !important;
	}
	.svg-icon {
		margin: 0px 10px;
	}
	.menu {
		letter-spacing: 2px;
	}
}
@media only screen and (max-width: 480px) {
	body {
		background-size: auto;
		background-position-x: -60px;
	}
	.thumbnail {
		height:275px !important;
	}
}
/* NEED AN IN BETWEEN. for IPAD. of certain height? need background-size: cover;  */
@font-face {
	font-family: Bebas;
	src: url("/fonts/BebasNeue-Regular.ttf");
}
@font-face {
	font-family: PlexSans;
	src: url("/fonts/IBMPlexSans-Regular.ttf");
}