/************************************************************************************
SCREEN SIZE < 1150
*************************************************************************************/

@media screen and (max-width: 1150px) {

	#page-wrap {
	width: 1020px;
}


	#page {
	width: 970px;
	
}
	
	#content {
	width: 660px;
}

	#header {
	width: 1020px;
}

		#header-content {
	width: 970px;
	}	#nav-content {
	width: 970px;
}

	img.site-logo {
	margin: 0px 0px 5px 0px;
		width: 190px;

}

		img.leaderboard {
	 margin: 25px 0px 0px 0px;
	}
	
.nav  {
  font-size: 17px;
line-height: 17px;

}

.nav-over  {
  font-size:17px;
line-height: 17px;
}

.slash  {
margin: 0px 14px;
}

.slash-mobile  {
margin: 0px 14px;
}

#social {
		width: 265px;
	}
	
	img.social-button {
	width: 22px;
	margin: 7px 15px 0 0;
}

	


.callbacks_container {
  width: 660px;
  height: 371px;
  }
  
  
.callbacks img {

  width: 660px;
  height: 371px;

  }

.callbacks .caption {
  }

	img.featured-act {
		width: 660px;
		height: 371px;
	}



		#sidebar {
	width: 260px;
}


	.release {
		width: 190px;
		
	}

	.release-gap {
		width: 45px;
	}
img.flyer-wide {
	width: 190px;
}
.event-info {
	width: calc(100% - 225px);
}
img.radio {
	width: 190px;
}

		.news-block {
		width: 310px;
		
	}
	
	.news-gap {
		width: 40px;
	}
	
	img.news-pic {
		width: 310px;
		height: 174px;
			}




}



/************************************************************************************
SCREEN SIZE < 720
*************************************************************************************/

@media screen and (max-width: 720px) {

	#page-wrap {
	width: 100%;
}


	#page {
	width: 100%;
		float: none; 
	margin: 0 auto;

	
}
	
	#content {
	width: 100%;
	float: none; 
	margin: 0 auto;
}

	#block {
		width: 90%;
		margin: 20px auto;
	}

	#header {
	width: 100%;
	top: 0;
	z-index: 999999;
	position: fixed;
	border-bottom: 1px solid #78cabd;

}

		#header-content {
	width: 100%;
	float: none; 
	}	
	
	
	#nav-content {
	width: 94%;
	float: none; 
	margin: 0 auto;
	text-align: center;
	}

	img.site-logo {
	margin: 0px 0px 0px 10px;
		width: 135px;

}

		img.leaderboard {
display: none;	}

	nav {
		display: block;
			z-index: 999999;

		}
		
	
	#nav-bar {
		margin-top: 108px;
		border-bottom: 1px solid #78cabd;
		margin-bottom: 0px;
		}

.nav  {
  font-size: 16px;
}

.nav-over  {
  font-size:16px;
line-height: 16px;

}


.slash  {
margin: 0px 5px;
}

.slash-mobile  {
margin: 0px 5px;
}



#social {
	display: none;
	}
	
	img.social-button {
	width: 22px;
	margin: 15px 15px 0 15px;
}

	
.callbacks_container {
  width: 100%;
  height: 405px;
  	z-index: 2;
border-bottom: 1px solid #78cabd;
 }
  
  
.callbacks img {
  width: 720px;

  height: 405px;
  left: calc(-360px + 50%);
	z-index: 2;

  }

.callbacks .caption {
font-size: 36px; line-height: 36px;  text-align: center;
padding: 20px 20px 40px 20px;
  }

	img.featured-act {
		width: 100%;
		height: auto;
	}



		#sidebar {
	width: 90%;
	float: none;
	margin: 0 auto;
}
	
	img.featured-release {
		width: 50%;
		height: auto;
	}

	.spotify-box {
	width: calc(50% - 40px);
}


.release {
		width: calc(33.3% - 17px);
		
	}

	.release-gap {
		width: 25px;
	}


	img.flyer-big {
		width: 50%;
		height: auto;
	}

	img.listings-band-pic {
		
		width: 50%;
		height: auto;
	}
	
	
	
	
		.news-block {
		width: calc(50% - 20px);
	}
	
	.news-gap {
		width: 40px;
	}
	
	img.news-pic {
		width: 100%;
		height: auto;
			}

}


/************************************************************************************
SCREEN SIZE < 640
*************************************************************************************/

@media screen and (max-width: 640px) {

	img.site-logo {
	margin: 2px auto 2px 10px;
	width: 100px;
	
}
	#header {
		height: 85px;
		position: fixed;
		top: 0;

}


	#nav-bar {
border-top: 0;
margin-top: 86px;

}




nav {
  margin: 13px 10px 0px 0px;
}

.slash  {
margin: 0px 3px;
}

.slash-mobile  {
margin: 0px 3px;
}

.callbacks_container {
  width: 100%;
  height: 360px;
  	z-index: 2;

 }
  
  
.callbacks img {
  width: 640px;

  height: 360px;
  left: calc(-320px + 50%);

  }

.callbacks .caption {
padding: 15px 15px 30px 15px;
  }


img.social-artist {
	width: 22px;
	margin: 0px 0px 0 10px;
}
		
			
			

}




/************************************************************************************
SCREEN SIZE < 520
*************************************************************************************/

@media screen and (max-width: 520px) {

	img.site-logo {
	margin: 2px auto 2px 10px;
	width: 100px;
	
}
	#header {
		height: 85px;
		position: fixed;
		top: 0;

}


	#nav-bar {
border-top: 0;
margin-top: 86px;

}

	.mobile-nav-gap  { 
		display: block;
		height: 3px;
		overflow: hidden;
		width: 100%;
}


.slash-mobile  {
display: none; 
}

.slash  {
margin: 0px 7px;
}


nav {
  margin: 13px 10px 0px 0px;
}


.callbacks_container {
  width: 100%;
  height: 293px;
  	z-index: 2;

 }
  
  
.callbacks img {
  width: 520px;

  height: 293px;
  left: calc(-260px + 50%);

  }

.callbacks .caption {
font-size: 30px; line-height: 30px;  
padding: 15px 15px 30px 15px;
  }





	
	
		img.social-button {
	width: 20px;
	margin: 0px 5px;
	padding: 0;
}

		.spotify-box {
	width: 100%;

}

	img.featured-release {
		width: 100%;
		float: none;
		margin: 0 0 30px 0;
	}


	.release {
		width: 100%;
		float: none;
		padding: 0 0 20px 0;
		border-bottom: 1px solid #eeeeee;
		margin: 0 0 20px 0;
		
	}

	.release-gap {
	display: none;
	}
	img.release-pic {
		width: 40%;
		float: right;
		margin: 0 0 0 15px;
	}
	
	
	img.radio {
		width: 40%;
		float: right;
		margin: 0 0 15px 15px;
}
	
	
	
	
		img.flyer-big {
		width: 100%;
		float: none;
		margin: 0 0 30px 0;
	}

.event {
	background-color: #ffffff;
	border: 0px;
	border-radius: 0px;
	padding: 0 0 30px 0;
	margin: 0 0 40px 0;
	border-bottom: 1px solid #dddddd;
}


img.flyer-wide {
		width: 40%;
		margin: 0 0 10px 0;
	}
	
.event-info {
	width: calc(60% - 10px);
	float: left;
	margin: 0 auto;
	padding: 0;

}




	img.listings-band-pic {
		
		float: none;
		width: 100%;
		margin: 0 0 20px 0;
	}
	
	
			.news-block {
		width: 100%;
		float: none;
		margin: 0 0 40px 0;
	}
	
	.news-gap {
display: none;
	}
	
	.grey-divider-releases {
display: none;
	}
			
			
	img.social-artist {
	width: 20px;
	margin: 0px 0px 0 7px;
}
		
			
			

}



/************************************************************************************
SCREEN SIZE < 170
*************************************************************************************/

@media screen and (max-width: 170px) {



img.flyer-wide {
		float: none;
		width: 100%;
		margin: 0 0 20px 0;
	}

.event-info {
	width: calc(100%);
	float: none;
	margin: 0 auto;
}


}