* {
	margin:0;
	padding:0;
	box-sizing:border-box;
}
img {
	border:none;
	outline:none;
	max-width:100%;
}
a {
	text-decoration:none;
	outline:none;
}
h1, h2, h3, h4, h5, h6 {
	font-weight:normal;
}
ul {
	list-style-type:none;
}

body{ background:#000 url(../images/background.jpg) center top no-repeat; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; font-family:Arial, Helvetica, sans-serif;}

.wrapper{ width:1060px; margin:30px auto;}


.social-sec{ text-align:center;}

.social-sec a{ display:inline-block; vertical-align:middle; margin:0 35px;}

.social-1{ background:url(../images/social-1.png) no-repeat; width:34px; height:35px; background-size:100% auto;}

.social-1:hover{background:url(../images/social-1-hover.png) no-repeat; background-size:100% auto;}

.social-2{ background:url(../images/social-2.png) no-repeat; width:33px; height:29px; background-size:100% auto;}

.social-2:hover{background:url(../images/social-2-hover.png) no-repeat; background-size:100% auto;}

.social-3{ background:url(../images/social-3.png) no-repeat; width:16px; height:35px; background-size:100% auto;}

.social-3:hover{background:url(../images/social-3-hover.png) no-repeat; background-size:100% auto;}

.social-4{ background:url(../images/social-4.png) no-repeat; width:28px; height:36px; background-size:100% auto;}

.social-4:hover{background:url(../images/social-4-hover.png) no-repeat; background-size:100% auto;}

.social-5{ background:url(../images/social-5.png) no-repeat; width:48px; height:22px; background-size:100% auto;}

.social-5:hover{background:url(../images/social-5-hover.png) no-repeat; background-size:100% auto;}

.mid-sec{ width:100%; display:inline-block; vertical-align:top; margin-top:40px;}

.mid-img{ float:left; width:552px;} 

.mid-img img{ display:block; width:100%;}

.mid-text{ float:right; width:500px; text-align:center;}

.avail-text{ text-align:center;}

.spotify-player{ width:100%; text-align:center; margin-top:60px;}

.spotify-player iframe{ width:100%; height:80px; border:none;}

.video-sec{ width:100%; margin-top:40px;}

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.more-vid-btn{ width:100%; text-align:center;}


.footer-social-sec{ text-align:center; margin:50px 0 50px;}

.footer-social-sec a{ display:inline-block; vertical-align:middle; margin:0 35px;}

.foot-social-1{ background:url(../images/social-1-hover.png) no-repeat; width:34px; height:35px; background-size:100% auto;}

.foot-social-1:hover{background:url(../images/social-1.png) no-repeat; background-size:100% auto;}

.foot-social-2{ background:url(../images/social-2-hover.png) no-repeat; width:33px; height:29px; background-size:100% auto;}

.foot-social-2:hover{background:url(../images/social-2.png) no-repeat; background-size:100% auto;}

.foot-social-3{ background:url(../images/social-3-hover.png) no-repeat; width:16px; height:35px; background-size:100% auto;}

.foot-social-3:hover{background:url(../images/social-3.png) no-repeat; background-size:100% auto;}

.foot-social-4{ background:url(../images/social-4-hover.png) no-repeat; width:28px; height:36px; background-size:100% auto;}

.foot-social-4:hover{background:url(../images/social-4.png) no-repeat; background-size:100% auto;}

.foot-social-5{ background:url(../images/social-5-hover.png) no-repeat; width:48px; height:22px; background-size:100% auto;}

.foot-social-5:hover{background:url(../images/social-5.png) no-repeat; background-size:100% auto;}

.foot-logo{ text-align:center; margin-bottom:40px;}

.copyright-text {
  color: #ffffff;
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 7px;
  line-height: 30px;
  margin:30px auto 30px;
  text-align: center;
  text-transform: uppercase;
 
}

.footer-img{ text-align:center;}

@media only screen and (min-width:768px) and (max-width:1110px){

.wrapper{ width:94%;}

.mid-img{ width:40%;}

.mid-text{ width:60%;}

}

@media only screen and (min-width:480px) and (max-width:767px){

.wrapper{ width:94%;}

.mid-img{ float:none; margin:0 auto; width:100%; text-align:center;} 

.mid-text{ width:100%; float:none; margin:30px auto 0;}


}


@media only screen and (min-width: 10px) and (max-width: 479px){

.wrapper{ width:94%;}

.social-sec a, .footer-social-sec a{ margin:0 11px;}
 
.mid-img{ float:none; margin:0 auto; width:100%; text-align:center;} 

.mid-text{ width:100%; float:none; margin:30px auto 0;}
 
}