cr iasita on codepen

CR IASITA ON CODEPEN
- use media rule for mobile settings,
- check element id always (common problem)

-- FONTS & ICONS --
@font-face {
font-family: lovely script;
src: url(https://dl.dropbox.com/s/ss5bqbogijw4zfj/LovelyScript.otf);
}

<script src="https://kit.fontawesome.com/8ef97d3168.js" crossorigin="anonymous"></script> <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=Kosugi+Maru&display=swap" rel="stylesheet">

-- NAME --
font-family: lovely script;
color: white;
-webkit-text-stroke: 1px black;
position: absolute;
left: -.875em;
top: 0.5em;
z-index: 9;

MOBILE:
position: absolute;
left: -2.25em;
top: 0.375em;

-- LEFT TEXT INFO --
height: 5em;
overflow: auto;
background: #FFF2F8;
padding: 5px;
border: 1px solid #CFCFCF;
border-radius: 10px;

-- IMAGE --
position: relative;
left: 5em;
top: -0.5em;
z-index: 8;