.quotePromo {
	background:#000;
	color:#fff;
	position: relative;
}


@keyframes fadeIn {
   0% {  
		opacity:0.2;
   }
   100% {
		opacity:1;  
   }
} 

@media(max-width: 700px) {
	@keyframes fadeIn {
	   0% {  
			opacity:0.2;
	   }
	   100% {
			opacity:0.6;  
	   }
	} 
}

.quotePromo-background {
	background:url('/wp-content/themes/westcott/static/images/canterbury.jpg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	position: absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;

	opacity:0.2;
	transition:1s opacity;
}

@media(max-width: 700px) {
/*	.quotePromo-background {
		background-position: top left 71% !important;
	}*/

	.quotePromo-content {
		max-width: 85%;
	}
}

.quotePromo.in-viewport .quotePromo-background {
	animation-name: fadeIn;
	animation-duration: 1.2s;
	animation-delay: 0.2s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-timing-function: cubic-bezier(0.55, 0.09, 0, 0.99);
	animation-fill-mode: forwards;
}

@keyframes textReveal {
   0% {  
		opacity:0;
		transform: translateY(50px);
   }
   100% {
		opacity:1;
		transform: translateY(0px);
   }
} 

.quotePromo-content {
	opacity:0;
	transform: translateY(50px);
}

.quotePromo.in-viewport .quotePromo-content {
	animation-name: textReveal;
	animation-duration: 1s;
	animation-delay: 0.2s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-timing-function: cubic-bezier(0.55, 0.09, 0, 0.99);
	animation-fill-mode: forwards;
}


.quotePromo blockquote {
	display: block;
	margin:0;
	padding:0;
/*	padding-top: 113px;
	padding-bottom: 137px;	*/


padding-top: 5%;
padding-bottom: 8%;

}

/*@media(max-width: 40rem) {
	.quotePromo blockquote {
		padding-top: 45px;
		padding-bottom: 100px;
	}
}*/

.quotePromo blockquote p {
	font-size: 35px;
    line-height: 39px;
    font-family: "Baskerville", sans;
    max-width: 830px;
    width: 60%;
    margin-bottom: 50px;
}

@media(max-width: 1100px) {
	.quotePromo blockquote p {
		font-size: 28px;
		line-height: 32px;
	}
}


@media(max-width: 700px) {
	.quotePromo blockquote p {
		font-size: 19px;
		line-height: 25px;
		max-width: 276px;
	}
}

.quotePromo blockquote cite {
	display: block;
	max-width: 800px;
}

.quotePromo .measure {
	max-width: 1586px;
	padding-left: 35px;
	padding-right: 35px;
}

@media(max-width: 700px) {
	.quotePromo .measure {
		padding-left: 20px;
		padding-right: 20px;
	}
}

.quotePromo-author {
	font-style: normal;
	font-size:19px;
	line-height: 27px;
	text-transform: uppercase;
}

@media(max-width: 700px) {
	.quotePromo-author {
		font-size: 17px;
		line-height: 25px;
	}
}

.quotePromo-role {
	font-style: normal;
	font-size:19px;
	line-height: 27px;
	opacity:0.5;
}

@media(max-width: 700px) {
	.quotePromo-role {
		font-size: 16px;
		line-height: 25px;
	}
}