Roaring Twenties - Misceláneo

<link href="https://fonts.googleapis.com/css2?family=Lato&family=Monoton&family=Montserrat+Alternates&display=swap" rel="stylesheet"><div class="mtwen"><div class="mtwen1"> <div class="mtwen2"> <div class="mtwent">Titulo</div><div class="mtwrec"> <div class="mtwrec1"> <div class="mtwr1"><div class="mtwrim"></div></div><div class="mtwr2">texto aqui </div></div><div class="mtwd1"> <div class="mtwd2">hola</div><div class="mtwd2">hola</div><div class="mtwd2">hola</div><div class="mtwd2">hola</div></div><div class="mtwsut">subtitulo aqui</div></div></div></div></div><div id="myscr"><a href="https://mystiqueworkshop.tumblr.com/">MYSTIQUE</a></div>
<style>.mtwen{--color1: #000; --color2:#FFF; --color3: #8A6E2F;--dorado:radial-gradient(ellipse farthest-corner at right bottom, #FEDB37 0%, #FDB931 8%, #9f7928 30%, #8A6E2F 40%, transparent 80%), radial-gradient(ellipse farthest-corner at left top, #FFFFFF 0%, #FFFFAC 8%, #D1B464 25%, #5d4a1f 62.5%, #5d4a1f 100%); --font1: 'Monoton'; --font2:'Montserrat Alternates'; --font3:'Lato';}.mtwen{width: 500px; height: 460px; background: var(--color1); margin: 0 auto; padding: 10px;}.mtwen1{width: 500px; height: 460px; background: var(--dorado);}.mtwen2{width: 490px; height: 450px; background: var(--color1); position: absolute; margin-top: 5px; margin-left: 5px;}.mtwent{font-family:var(--font1); font-size: 40px; text-align: center; color: var(--color3); margin-top: 25px;}.mtwent2{font-family:var(--font2); font-size: 15px; text-align: center; color: var(--color3);}.mtwrec{background: var(--dorado); width: 470px; height: 365px; padding: 5px; margin: 0 auto; margin-top: 20px;}.mtwrec1{display: flex;}.mtwr1{width: 200px; height: 320px; border: 2px solid var(--color1); margin-left: 5px; margin-top: 10px;}.mtwrim{width: 200px; height: 320px; background: url('http://placehold.it/200x320/8A6E2F/000000'); margin-top: 0px;}.mtwr2{width: 210px; height: 270px; border-bottom:14px solid var(--color1);padding: 20px; overflow: auto; background: var(--color1); margin-top: 10px; margin-left: 5px; color: var(--color3); font-family:var(--font3); font-size: 12px; text-align: justify;}.mtwd1{width: 200px; margin: 0 auto; position: absolute; margin-top: -118px; margin-left: 5px;}.mtwd2{width: 194px; height: 15px; padding: 5px; background: var(--color1); color: var(--color3); text-align: center; font-size: 12px; margin-top: 2px; font-family:var(--font3);}.mtwsut{font-family:var(--font2); color: var(--color1); font-size: 15px; text-align: center; margin-top: 5px;}#myscr{font-family: 'Century Gothic'; font-size: 11px; text-align: center; color: #333; margin: 0 auto; margin-top: 1px;}#myscr a{color: #333;text-decoration: none;}.mtwr2::-webkit-scrollbar-button:start:decrement, .mtwr2::-webkit-scrollbar-button:end:increment{display:none;}.mtwr2::-webkit-scrollbar{width:3px; height: auto;}.mtwr2::-webkit-scrollbar-thumb:vertical{background-color: var(--color3);}.mtwr2::-moz-scrollbar-button:start:decrement, -webkit-scrollbar-button:end:increment{display:none;}.mtwr2::-moz-scrollbar{width:2px; height: auto;}.mtwr2::-moz-scrollbar-thumb:vertical{background-color: var(--color3);}</style>