HTML
<link href="https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@0,400;0,700;1,400;1,700&family=Poppins:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
<body>
<div class="lutemp01-outer">
<div class="lutemp01-outer2">
<div class="lutemp01-title"> reasons wretched</div>
<div class="lutemp01-inner">
<div class="lutemp01-post">
<div class="lutemp01-reply">
post here. This is <b>bold tho.</b>
</div>
<div class="lutemp01-notes">note / ## words / tag</div>
</div>
</div>
</div>
</div>
</body>
CSS
.lutemp01-outer {
background-image: url(https://i.postimg.cc/cCPPfTKQ/apppic2.jpg);
width: 400px;
margin: auto;
padding: 11px;
}
.lutemp01-outer2 {
background: rgba(234, 172, 143,.7);
width: ;
padding: 50px;
border: 1px solid white;
}
.lutemp01-title {
background: ;
min-width: 50px;
margin: auto;
text-align: center;
position: relative;
top: -20px;
font-family: 'Cormorant', serif;
text-transform: uppercase;
font-size: 20px;
letter-spacing: 2px;
font-style: italic;
color: #ffffff;
}
.lutemp01-inner {
background: rgba(255,255,255,.5);
height: 400px;
border: 1px solid #F48668;
}
.lutemp01-reply {
background: rgba(255,255,255, .5);
height: 390px;
overflow-y: auto;
text-align: justify;
margin: auto;
font-family: 'Poppins', sans-serif;
font-size: 12px;
padding: 5px;
color: #000000;
}
.lutemp01-notes {
padding-top: 4px;
color: #ffffff;
font-family: 'Cormorant', serif;
font-style: italic;
text-transform: uppercase;
letter-spacing: 1px;
font-size: 11px;
text-align: center;
}
.lutemp01-reply b{
color: #7E6C6C;
font-weight: bold;
font-style: italic;
font-size: 12px;
}
