all codes for jibeomcito tut 3

<!--- TOP CONTAINER --->
border-radius: 0.5em 0.5em 0em 0em;


<!--- BOTTOM CONTAINER --->
border-radius: 0em 0em 0.5em 0.5em;


<!--- BUTTONS POSITIONING -->
position: relative;
bottom: 0.25em;
right: 0.5em;

<!--- BUTTONS EXPAND ON HOVER --->
<style>
#buttons01 a {
transition: 0.4s;
}

#buttons01 a:hover {
letter-spacing: 5px;
transition: 0.4s;
}
</style>


<!--- CONTAINERS WITH INFO POSITIONING --->
position: absolute;
right: 0.875em;
bottom: 1.875em;


<!--- TEXT CSS --->
background: #eecebd;
padding: 8px;
border-radius: 0.5em;


<!--- MALI FONT --->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Mali:wght@700&display=swap" rel="stylesheet">


<!--- MARK CSS --->
font-family: 'Mali', cursive;
color: white;
background: #e36464;
padding-left: 10px;
padding-right: 10px;
border-radius: 1em;
font-weight: bold;
line-height: 0;

<!--- COLUMN STYLING FIRST CONT --->
<style>
#container04 > .wrapper > .inner > :nth-child(1) {
margin-left: auto;
margin-right: auto;
width: 40%;
height: 14.25em;
overflow: auto;
}
#container04 > .wrapper > .inner > :nth-child(2) {
width: 60%;
margin-left: auto;
margin-right: auto;
}
#container04 {
justify-content: space-between !important;
margin: auto;
}
</style>


<!--- COLUMN STYLING SECOND CONT --->
<style>
#container04 > .wrapper > .inner > :nth-child(1) {
margin-left: auto;
margin-right: auto;
width: 40%;
height: 14.25em;
overflow: auto;
}
#container04 > .wrapper > .inner > :nth-child(2) {
width: 60%;
margin-left: auto;
margin-right: auto;
}
#container04 {
justify-content: space-between !important;
margin: auto;
}
</style>