@charset "utf-8";
/* CSS Document */

@media screen and (max-width: 1100px) {
	#sound-design {
		font-size: 16px;
	}
}

@media screen and (max-width: 1024px) {
	/* disable parallax */
	#about-box,
	#bernie-box,
	#listen-box,
	#katherine-box,
	#sound-design,
	#programs,
	#consultation,
	#workshops,
	#gorilla,
	#store,
	#publications,
	#contact,
	#audio-archive,
	#elephant,
	#gators,
	.scrollblock,
	#bgone,
	#bgtwo {
		top: 0 !important;
		}
	#bgone,
	#bgtwo {
		z-index: -1;
	}
	/* fix menu scroller when parallax is turned off */
	#about-box-link,
	#bernie-box-link,
	#listen-box-link,
	#katherine-box-link,
	#sound-design-link,
	#programs-link,
	#consultation-link,
	#workshops-link,
	#gorilla-link,
	#store-link,
	#publications-link,
	#contact-link,
	#audio-archive-link,
	#elephant-link,
	#gators-link {
		top: 0;
		}
}

@media screen and (max-width: 990px) {
	
	body {
		font-size: 16px;
		background-size: cover;
		background-image: url(images/backgrounds/desert.jpg) center;
		background-position: fixed;
		}
	h2 {
		font-size: 35px;
		padding: 35px 0 15px 0;
		}	
	p {
		margin: 0 0 12px 50px;
		}	
	.link-box {
		margin-left: 50px;
		}		
	
  	/* SIDEBAR MENU */
	#sidebar {
		left: 0;
		top: 0;
		position: fixed;
		background: #0c0c0c;
		width: 250px;
		z-index: 100;
	}
	#sidebar .logo,
	#sidebar .logo img {
		display: block;
		width: 250px;
		}
	#sidebar ul {
		margin: 15px 0 15px 20px;
	}
	#sidebar li {
		margin-top: 4px;
	}
	#sidebar ul a {
		font-size: 15px;
	}
	#sidebar .blog-excerpts {
		padding: 15px 10px 15px 20px;
	}
		.blog-excerpts img {
			margin: 0 10px 0 0;
			width: 70px;
		}
		.blog-excerpts h3 {
			font-size: 14px;
		}
		.blog-excerpts p {
			font-size: 12px;
			margin: 0;
		}
	#social {
		padding: 10px 10px 10px 15px;
	}
	#sidebar div.jp-audio {
		width: 250px;
		}
		#sidebar .jp-controls {
			padding-top: 0 !important;
			}
		#sidebar div.jp-audio div.jp-type-single div.jp-interface {
			height: 50px;
			}
		#sidebar div.jp-audio div.jp-type-single div.jp-progress {
			width: 142px;
			top: 15px;
			}	
		#sidebar .jp-mute,
		#sidebar .jp-unmute {
			margin-left: 148px !important;
			}	
		#sidebar div.jp-audio div.jp-time-holder {
			top: 31px;
			}	
		#sidebar div.jp-audio div.jp-type-single div.jp-time-holder {
			width: 142px;
			}	
		#sidebar .jp-title {
			display: none;
		}
	
	/* ABOUT BOX */
	#about-box {
		width: 50%;
		margin-left: 250px;
		}
	
	/* BERNIE BOX */
	#bernie-box {
		width: 400px;
		height: 450px;
		background-size: cover;
		background-position: top;
		}
	#bernie-box p.quote {
		font-size: 18px;
		}	
	#bernie-box p.cite {
		padding: 3% 10% 0 25%;
		}	
		
	/* KATHERINE BOX */
	#katherine-box {
		width: 400px;
		height: 500px;
		margin-left: 43%;
		}
	#katherine-box p.quote {
		font-size: 20px;
		padding: 50% 10% 0 15%;
		}	
		
	/* audio archive */
	#audio-archive {
		width: 50%;
	}
	#audio-archive img {
		float: none;
		margin-left: 0;
		width: 100%;
	}
		
	/* elephant */
	#elephant {
		width: 575px;
		height: 355px;
		background-size: cover;
		}
		#elephant p.quote {
			font-size: 23px;
			}	
		
	/* SOUND DESIGN */
	#sound-design {
		width: 55%;
		height: 450px;
		background-size: contain;
		background-position: -85px 0;
		margin-left: 20%;
		padding-left: 180px;
		font-size: 15px;
		}
	#sound-design h2 {
		padding: 6% 0 2% 0;
		}
	#sound-design p {
		line-height: 1.3;
		}		
	#sound-design .link-box {
		margin-left: 205;
	}
		
	/* PROGRAMS */
	#programs {
		width: 400px;
		margin-left: 275px;
		}	
		
	/* INSTALLATION AND CONSULTATION */
	#consultation {
		margin-left: 30%;
		background-position: -250px 0;
		width: 50%;
		}
	#consultation p {
		margin-left: 0;
		}	
	#consultation .link-box {
		margin-left: 0;
		}	
		
	/* WORKSHOPS */
	#workshops {
		margin-left: 35%;
		}
		
	/* GORILLA BOX */
	#gorilla {
		width: 575px;
		height: 325px;
		background-size: cover;
		}
		#gorilla .quote {
			padding-top: 8%;
			padding-left: 12%;
		}
		#gorilla p {
			font-size: 20px;
			}
		#gorilla a {
			margin-left: 50px;
			}	
		
	/* THE GREAT ANIMAL ORCHESTRA */	
	#store {
		padding: 5% 3% 5% 7%;
		width: 400px;
		margin-left: 30%;
		}
	#store img.book {
		width: 150px;
		height: auto;
		}	
	#store h2 {
		font-size: 30px;
		padding-top: 5px;
		}	
	#store p {
		font-size: 16px;
		}	
		
	/* GATORS BOX */
	#gators {
		width: 575px;
		height: 325px;
		background-size: cover;
		}
		#gators .quote p {
			font-size: 20px;
			}	
		
	/* CONTACT */
	#contact {
		padding: 0 5% 5% 5%;
		}
}

@media screen and (max-width: 870px) {
	#bernie-box {
		margin-left: 42%;
		}
	#listen-box {
		width: 350px;
		margin-left: 250px;
		}	
		#listen-box p,
		#listen-box div.jp-audio {
			margin-left: 0;
			}
	#audio-archive {
		margin-left: 250px;
		}	
		#audio-archive p,
		#audio-archive div.jp-audio {
			margin-left: 0;
			}	
	#sound-design {
		background-image: none;
		height: auto;
		padding-left: 5%;
		padding-right: 5%;
		padding-bottom: 5%;
		margin-left: 30%;
		width: 57%;
		}			
		#sound-design p,
		#sound-design ul {
			margin-left: 0;
			}	
		#sound-design .link-box {
			margin-left: 0;
		}
	#programs {
		width: 350px;
		}	
		#programs p,
		#programs .link-box {
			margin-left: 0;
			}
	#gorilla {
		width: 535px;
		margin-left: 23%;
		}		
		#gorilla p.quote {
			font-size: 20px;
			}
	#elephant {
		width: 535px;
		}		
		#elephant p.quote {
			font-size: 20px;
			}	
	#gators {
		width: 535px;
		margin-left: 23%;
		}	
	#popup-consultation .client {
		width: 100%;
		padding-right: 0;
	}		
}

@media screen and (max-width: 725px) {
	
	/* SIDEBAR MENU */
	#sidebar {
		left: 0;
		top: 0;
		position: fixed;
		background: #0c0c0c;
		width: 200px;
		z-index: 100;
	}
	#sidebar .logo,
	#sidebar .logo img {
		display: block;
		width: 200px;
		}
	#sidebar ul {
		margin: 15px 0 15px 20px;
	}
	#sidebar li {
		margin-top: 4px;
	}
	#sidebar ul a {
		font-size: 15px;
	}
	#sidebar .blog-excerpts {
		padding: 15px 10px 15px 20px;
	}
		.blog-excerpts img {
			margin: 0 10px 0 0;
			width: 70px;
		}
		.blog-excerpts h3 {
			font-size: 14px;
		}
		.blog-excerpts p {
			font-size: 12px;
			margin: 0;
		}
	#social {
		padding: 10px 10px 10px 15px;
	}
	#sidebar div.jp-audio {
		width: 200px;
		}
		#sidebar .jp-controls {
			padding-top: 0 !important;
			}
		#sidebar div.jp-audio div.jp-type-single div.jp-interface {
			height: 50px;
			}
		#sidebar div.jp-audio div.jp-type-single div.jp-progress {
			width: 92px;
			top: 15px;
			}	
		#sidebar .jp-mute,
		#sidebar .jp-unmute {
			margin-left: 98px !important;
			}	
		#sidebar div.jp-audio div.jp-time-holder {
			top: 31px;
			}	
		#sidebar div.jp-audio div.jp-type-single div.jp-time-holder {
			width: 92px;
			}	
		#sidebar div.jp-current-time, div.jp-duration {
			width: 45px;
			}	
	
	body {
		font-size: 16px;
		}
	h2 {
		font-size: 28px;
		padding: 20px 0 10px 0;
		}	
	p {
		margin: 0 0 12px 0;
		line-height: 1.3;
		}	
	.link-box {
		margin-left: 0;
		}	
	#sidebar {
		position: absolute;
		}
	#about-box {
		top: 0;
		margin-top: 0;
		width: 45%;
		height: auto;
		margin-left: 200px;
		padding: 0 5% 5% 5%;
		}
	#bernie-box {
		margin-left: 30%;
		width: 60%;
		height: 350px;
		background-position: center;
		}	
		#bernie-box p.quote {
			padding-top: 150px;
			font-size: 17px;
			padding-left: 10%;
			padding-right: 10%;
			}
		#bernie-box p.cite {
			font-size: 10px;
			padding-left: 10%;
			}	
	#listen-box {
		margin-left: 15%;
		width: 65%;
		}			
	#katherine-box {
		width: 315px;
		height: 350px;
		background-size: cover;
		margin-left: 20%;
		}		
		#katherine-box p.quote {
			padding-top: 40%;
			font-size: 16px;
			}	
	#audio-archive {
		margin-left: 15%;
		width: 65%;
		}		
	#sound-design {
		margin-left: 15%;
		}	
	#elephant {
		margin-left: 6%;
		width: 415px;
		height: 275px;
		background-size: cover;
		background-position: right;
		}	
		#elephant p.quote {
			font-size: 18px;
			}			
	#programs {
		margin-left: 15%;
		width: 70%;
		}	
	#consultation {
		margin-left: 10%;
		width: 60%;
		background-position: -500px 0;
		}	
		#consultation .credit {
			bottom: 5px;
			right: 5px;
		}
		#consultation h2 {
			font-size: 25px;
		}
	#workshops {
		margin-left: 10%;
		width: 70%;
		}	
	#gorilla {
		margin-left: 6%;
		width: 415px;
		height: 320px;
		background-size: cover;
		background-position: right;
		}	
		#gorilla p {
			font-size: 16px;
			}
		#gorilla a {
			margin-left: 0;
			}	
	#store {
		margin-left: 5%;
		width: 75%;
		}	
		#store img.book {
			width: 100px;
			}
		#store h2 {
			font-size: 25px;
			}	
	#publications {
		width: 70%;
		margin-left: 12%;
		}	
	#gators {
		margin-left: 6%;
		width: 415px;
		height: 250px;
		}	
		#gators .quote p {
			padding: 10% 10% 0 10%;
			line-height: 1.5;
			font-size: 18px;
		}
	}
	
@media screen and (max-width: 465px) {	

	.link-box {
		font-size: 15px;
		}
	.scrollblock {
		padding-top: 495px;
		}	
	
	/* SIDEBAR MENU */
	#sidebar {
		position: absolute;
		width: 100%;
		height: 480px;
	}
	#sidebar .logo,
	#sidebar .logo img {
		display: block;
		width: 100%;
		}
	#sidebar div.jp-audio {
		width: 100%;
		}
		#sidebar .jp-controls {
			padding-top: 0 !important;
			}
		#sidebar div.jp-audio div.jp-type-single div.jp-interface {
			height: 50px;
			}
		#sidebar div.jp-audio div.jp-type-single div.jp-progress {
			width: 172px;
			top: 15px;
			}	
		#sidebar .jp-mute,
		#sidebar .jp-unmute {
			margin-left: 178px !important;
			}	
		#sidebar div.jp-audio div.jp-time-holder {
			top: 31px;
			}	
		#sidebar div.jp-audio div.jp-type-single div.jp-time-holder {
			width: 172px;
			}	
		#sidebar div.jp-current-time, div.jp-duration {
			width: 45px;
			}		
	#about-box {
		width: 90%;
		top: 0;
		margin: 0;
		}		
	#bernie-box {
		margin: 15px 0 0 0;
		width: 100%;
		}		
	#listen-box {
		margin: 15px 0 0 0;
		width: 90%;
		}	
		#listen-box div.jp-audio {
			width: 250px;
			}
		#listen-box div.jp-audio div.jp-type-single div.jp-interface {
			height: 50px;
			}	
		#listen-box div.jp-audio ul.jp-controls {
			padding: 0;
			width: 100% !important;
			}
		#listen-box div.jp-audio div.jp-type-single div.jp-progress {
			left: 30px;
			}	
		#listen-box div.jp-audio div.jp-type-single div.jp-time-holder {
			left: 30px;
			}	
	#katherine-box {
		margin: 15px 0 0 0;
		width: 100%;
		}	
	#audio-archive {
		margin: 15px 0 0 0;
		width: 90%;
		}	
		#audio-archive div.jp-audio {
			width: 250px;
			}
		#audio-archive div.jp-audio div.jp-type-single div.jp-interface {
			height: 50px;
			}	
		#audio-archive div.jp-audio ul.jp-controls {
			padding: 0;
			width: 100% !important;
			}
		#audio-archive div.jp-audio div.jp-type-single div.jp-progress {
			left: 30px;
			}	
		#audio-archive div.jp-audio div.jp-type-single div.jp-time-holder {
			left: 30px;
			}		
	#elephant {
		margin: 15px 0 0 0;
		width: 100%;
		}			
	#sound-design {
		margin: 15px 0 0 0;
		width: 90%;
		}	
	#programs {
		margin: 15px 0 0 0;
		width: 90%;
		}	
	#consultation {
		margin: 15px 0 0 0;
		width: 90%;
		padding: 0 5% 5% 5%;
		}	
	#workshops {
		margin: 15px 0 0 0;
		width: 90%;
		}	
	#gorilla {
		margin: 15px 0 0 0;
		width: 100%;
		height: 330px;
		}	
	#store {
		margin: 15px 0 0 0;
		width: 90%;
		}	
	#publications {
		margin: 15px 0 0 0;
		width: 90%;
		padding: 0 5% 5% 5%;
		}	
	#gators {
		margin: 15px 0 0 0;
		padding: 0 5% 5% 5%;
		width: 90%;
		}	
	#contact {
		margin: 15px 0 0 0;
		width: 90%;
		}	
}