Container Breaking Blockquote

On my OGAL blog I wanted to create a stylized blockquote that broke the container a bit to help stand out.

@media (min-width: 1025px) {
.dynamic-entry-content blockquote{
	margin-bottom: -20px;
	border: none;
}
.dynamic-entry-content .wp-block-quote p{
	border-top: 2px solid #ccc;
	color: #000e26;
	max-width: 420px;
	font-size: 28px;
	line-height: 1.5;
	border-left: none;
	padding-top: 16px;
	padding-left: 0px;
	padding-right: 16px;
	padding-bottom: 0px;
        clear: both;
        float: left;
	margin-left: -120px;
	margin-top: 10px; 
	margin-right: 48px;
	margin-bottom: 48px;
	font-weight: bold;
	font-style: normal;	
}
	
}

@media (min-width: 769px) and (max-width: 1024px){
.dynamic-entry-content blockquote{
	margin-bottom: -20px;
	border: none;
}
.dynamic-entry-content .wp-block-quote p{
	border-top: 2px solid #ccc;
	color: #000e26;
	max-width: 420px;
	font-size: 28px;
	line-height: 1.5;
	border-left: none;
	padding-top: 16px;
	padding-left: 00px;
	padding-right: 16px;
	padding-bottom: 0px;
        clear: both;
        float: left;
	margin-left: -20px;
	margin-top: 10px; 
	margin-right: 48px;
	margin-bottom: 48px;
	font-weight: bold;
	font-style: normal;	
}
}
	
@media (max-width: 768px) {
   .dynamic-entry-content blockquote{
	margin-bottom: -20px;
	border: none;
}
.dynamic-entry-content .wp-block-quote p{
	border-top: 2px solid #ccc;
	color: #000e26;
        width: 100%;
	font-size: 28px;
	line-height: 1.5;
	border-left: none;
	padding-top: 16px;
	padding-left: 00px;
	padding-right: 0px;
	padding-bottom: 0px;
	margin-left: -20px;
	margin-right: 0px;
	margin-bottom: 48px;
	font-weight: bold;
	font-style: normal;
}
}

A few things to note about this code…

1. The media queries probably contain a lot of redundant code and could be further optimized.
2. I only wanted to affect the blockquotes inside of my blog posts, so the wp-block-quote selector is nested inside a selector I have on the container of my blog posts (.dynamic-entry-content)