html, body {
        background-color: #5f5f5f;
        margin: 0;
        padding: 0;
        font-family: sans-serif;
}

div.container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 30px;
}

header {
		background-color: #000000;
		height: 60px;
        float: left;
        width: 100%;
		box-shadow: 0 5px 5px 0 gray;
		position: fixed;
		z-index: 4;
}

header h1 {
        color: #ffffff;
        text-transform: uppercase;
        float: left;
	    margin-top: 15px;
}

header h1 a {
	text-decoration: none;
	color:#ffffff;
	font-size: 15px;
}

header ul {
        list-style-type: none;
        padding: 0;
        margin: 18px 0 0 0;
        float: right;
}

.banner {
	width: 100%;
	background-color: white;
	padding-top: 50px;
	display: block;
}

.banner .banner-image {
	width: 100%;
	display: block;
}

.banner .header-image {
	padding-top: 23px;
	margin-left: 145px;
	height: 50px;
	width: auto;
	display: block;
}

.Gallery {
	background-color: black;
	width: 550px;
}

@media all and (max-width:850px){
		header {
				height: 45px;
		}
        header ul {
                display: none;
        }
		div.Text {
				display: none;
		}
		.banner .header-image{
				padding-top: 35px;
				margin-left: 45px;
				height: 35px;
				width: auto;
				display: block;
		}
	 	.banner .banner-image {
				padding-top: 50px;
		}
		.Gallery {
				vertical-align: middle;
				width: 85%;
		}
}

header img.hamburger {
        display: none;
        max-width: 25px;
        margin-top: 28px;
        float: right;
}

header img.logo-pic {
	max-height: 50px;
	position: absolute;
	top: 0;
	float: left;
	display: block;
}

header img.hamburger:hover{
	cursor:pointer;
}

@media all and (max-width:850px){
        header img.hamburger {
				margin-top: 15px;
				margin-bottom: 15px;
                display: block;
        }
		header img.logo-pic {
				display: block;
				max-height: 40px;
				position: absolute;
				top: 5;
				float: left;
		}
}

header ul li {
        display: inline-block;
		color: #ffffff;
}

header ul li a {
        color: #ffffff;
        text-transform: uppercase;
        text-decoration: none;
        padding: 12px 3px 12px 3px;
        display: block;
		font-size: 12px;
}
header ul li a:hover{
	color:cadetblue;
}

header ul li a:active {
	color:blueviolet;
}

div.overlay {
        display: none;
        background-color: rgba(0,0,0,0.7);
        position: absolute;
        width: 100%;
        height: 600px;
		z-index: 6;
}

div.overlay ul {
        padding: 0;
        margin: 100px 0 0 0;
        display: block;
        width: 80%;
        text-align: left;
		float: right;
}


div.overlay ul li {
        display: block;
}

div.overlay ul li a {
        color: #ffffff;
        text-transform: uppercase;
        text-decoration: none;
        padding: 10px;
        display: block;
        font-size: 25px;
}

div.overlay ul li a:hover{
	color:cadetblue;
}

div.overlay ul li a:active{
	color:blueviolet;
}

div.overlay img.close {
        max-width: 30px;
        position: absolute;
        right: 30px;
        top: 26px;
		z-index: 5;
}
div.overlay img.close:hover{
	cursor: pointer;
}

div.block{
	float: left;
	width: 100%;
}

div.block.one{
	display: block;
	background: white;
}
div.block.two{
	background: white;
}
div.block.three{
	background: white;
	padding-bottom: 50px;

}
div.block.four{
	background: white;
}
div.Text{
	font-family: sans-serif;
	background-color: none;
	position: absolute;
	top: 120px;
	left: 22px;
	max-width: 150px;
	display: none;
	z-index: 2;
}

div.narrow-text {
	margin-left: auto;
	margin-right: auto;
	font-family: sans-serif;
	font-size: 20px;
	background-color: none;
 	text-align:center;
	max-width: 600px;
	postion: absolute;
	top: 50px;
}

@media all and (max-width:850px){
        header img.hamburger {
                display: block;
        }

		div.block.one {
				display: block;
		}
		.myPlayer {
				width: 50px;
				padding-left: 5px;
		}
	
	   audio::-webkit-media-controls-timeline {
				width: 0px;
				padding-left: 5px; 
			}
	
		div.narrow-text {
			margin-left: auto;
			margin-right: auto;
			font-family: sans-serif;
			font-size: 14px;
			background-color: none;
 			text-align: center;
			max-width: 300px;
			postion: absolute;
			top: 50px;
		}	
}

.soundwave {
	width: 100%;
	background-color: #FFFFFF;
	height: 50px;
	display: block;
	padding-top: 50px;
	padding-bottom: 90px;
}

.soundwave .soundwave-image {
	margin-left: auto;
	margin-right: auto;
	width: 80%;
	max-height: 100px;
	display: block;
}

.con_table {
	margin-left: auto;
	margin-right: auto;
	width: 80%;
	background-color:aliceblue;
	border: none;
	height: 450px;
}
.Table {
	margin-left: auto;
	margin-right: auto;
	width: 80%;
	background-color: white;
	border: thick;
	
}

.Table .Table_Header {
	font-family: sans-serif;
	font-size: 35px;
	font-weight: bold;
	color:darkslateblue;
	text-align: center;
	padding: 15px;
}

.Table_Column1 {
	width: 60%;
}

.Table .content {
	text-align: left;
}

.Table .Listen_Button {
	max-height: 30px;
	padding-top: 3px;
}

.Table .Listen_Button:hover{
	cursor:pointer;
}

.Table .Download_Button {
	max-height: 30px;
	padding-top: 3px;
}

.Table .Download_Button:hover{
	cursor:pointer;
}

.Sale_Image {
	max-height: 150px;
	padding-top: 30px;
}

.Table .Sale-Cell {
	width: 50%;
}


.footer {
		background-color: #000000;
        height: 100px;
        width: 100%;
		box-shadow: 0 0 0 0 gray;
}

.footer ul {
	color: white;
	font-family: sans-serif;
	font-size: 12px;
	list-style-type: none;
}

.footer ul a {
	text-decoration: none;
	color: white;
}

.footer ul a:hover {
	text-decoration: none;
	color: cadetblue;
}

.footer ul a:active {
	text-decoration: none;
	color: blueviolet;
}

.footer_first{
	float:left;
}

.footer_second{
	float:left;
	padding-left: 10px;
}

.footer_third{
	float:left;
	padding-left: 10px;
}

.footer_fourth{
	float:right;
}

.footer_fourth .logo-bottom {
	max-height: 80px;
	vertical-align: middle;
}

.divider {
	height: 45px;
}

.divider .HRule {
	margin-top: 35px;
	margin-left:auto;
	margin-right:auto;
	display: block;
	height: 3px;
	width: 80%;
}
.copyright {
	text-align: center;
	padding-top: 70px;
	padding-right: 100px;
	color: white;
	font-family: sans-serif;
	font-size: 10px;
}

@media all and (max-width:850px){
	.divider {
	height: 45px;
	}
	.divider2 {
		height: 35px;
	}
	.footer {
		height: 100px;
	}
	.footer_fourth .logo-bottom {
	max-height: 60px;
	vertical-align: middle;
	}
	.copyright {
		font-size: 7px;
		padding-top: 75px;
		padding-right: 90px;
	}
	.logo-bottom {
		display: none;
	}
	
	.Table {
		width: 60%;
	}
	
	.Table .Table_Header {
	font-family: sans-serif;
	font-size: 15px;
	font-weight: bold;
	color:darkslateblue;
	text-align: center;
	padding: 15px;
	}
	.Sale_Image {
	height: 100px;
	padding-top: 10px;
	}

	.Table .sale1 {
	height: 125px;
	}
	
	
}



.divider3 {
	height: 45px;
}

.divider3 .HRule {
	margin-top: 10px;
	margin-left:auto;
	margin-right:auto;
	display: block;
	height: 3px;
	width: 80%;
}

.Calendar {
	max-width: 90%;
	background:linear-gradient(0deg, purple, navy 30%, black);
	min-height: 350px;
}
.Cal_Head {
	background:#64075B;
	color:aliceblue;
}

.myDate {
	vertical-align: top;
	text-align: left;
	padding-right: 5px;
	background: white;
	width: 10%;
}
.myVenue {
	vertical-align: top;
	text-align: left;
	background: white;	
	width: 20%;
}
.myDes{
	vertical-align: top;
	background: white;
}

.Music {
	width: 80%;
}

.Music tr td {
	text-align: center;
}

.Merch {
	width: 80%;
}

.Merch tr td {
	text-align: center;
}