try to hide mb-attrubution diplayed outside

try to hide mb-attrubution diplayed outside of div.mb-style

by bioinfornatics

HTML

<div class="mb-wrap mb-style">
    <div class="mb-thumb"></div>
    <blockquote cite="">
        <p>Je ne fais ni de l’Art pour l’Art, ni de l’Art contre l’Art. Je suis pour l’Art, <span>mais pour l’art qui n’a rien à voir avec l’Art, </span> car l’art a tout à voir avec la vie.</p>
    </blockquote>
    <div class="mb-attribution">
        <p class="mb-author">Robert Rauschenberg</p>
        <cite></cite>
    </div>
    <!-- #mb-attribution-->
</div>
<!--#mb-wrap-->

CSS

.mb-style {
	width: auto;
	padding: 20px 240px 50px 20px;
	background: #444 url(https://www.beart.fr/wp-content/uploads/2019/02/1998-Robert-Rauschenberg-Retrospectiva.jpg) no-repeat;
	box-shadow: inset 0 0 10px rgba(0,0,0,0.6);
	overflow: hidden;
  backface-visibility: hidden;
}

.mb-style blockquote p {
	color: rgba(255,255,255,0.95);
	font-size: 21px;
	line-height: 26px;
	text-align: right;
	color: #999;
	text-transform: uppercase;
	font-weight: bold;
}

.mb-style blockquote p span {
	font-weight: 700;
	color: #fcf779;
	font-size: 58px;
	line-height: 58px;
	display: block;
	padding: 10px;
	text-shadow: 7px 7px 2px rgba(0,0,0,0.2);
	transform: rotate(-7deg) translateY(10px);
}

.mb-style blockquote p span:before {
	font-family: 'icons';
	content: '\275d'; 
	font-weight: normal;
	opacity: 0.1;
	font-size: 136px;
	position: absolute;
	color: #fff;
	top: -50px;
	left: -25px;
	transform: rotate(45deg);
}

.mb-style .mb-attribution {
	text-align: right;
	text-transform: uppercase;
	font-weight: bold;
	background: #757575;
	position: absolute;
	left: 0px;
	bottom: 0px;
	text-align: center;
	padding: 30px;
	transform: rotate(-40deg) translate(405px, 380px);
}

.mb-style .mb-author:before {
	content: '\2014';
	padding-right: 4px;
}

.mb-style .mb-attribution cite a{
	color: #777;
}

.mb-style .mb-attribution cite a:hover{
	color: #fcf779;
}