@font-face{font-family: "ninifont";
src:url(font.ttf);}
@font-face{font-family: "babydollfont";
src:url(babydoll.ttf);}

body{background-color: beige;
background-image: url("heart.png");
background-size: 120px;}

.main{width: 900px;
background-color: lightpink;
padding: 20px;
margin: 80px auto;
border-radius: 30px;}

.banner{background-color: palevioletred;
padding:20px;
border-radius: 30px;}

h1{text-align: center;
font-family: "ninifont";}

.content{display: flex;
gap:20px;}
.info{width: 200px;
min-height: 300px;
border: 2px solid lightpink;
border-radius: 20px;
padding: 10px;
background-color: lightpink;}

.avatar{width: 150px;
display: block;
margin: auto;}

p{text-align:center;
font-family:"babydollfont";}

.rightside{border: 2px solid lightpink;
display:flex;
flex-direction: column;
background-color: lightpink;
border-radius:20px;}

.avatar1{width: 120px;
height: 120px;
display:block;
border-radius:50%;}

.topsection{display: flex;
gap: 15px;}

.dialogue{background-color: beige;
font-size: 14px;
min-height:60px;
padding: 20px;
border-radius: 20px;
max-width:400px;
overflow-y: auto}

.choices{margin-top:20px;
display:flex;
flex-direction:column;
gap:15px;}

.choices button{background-color:beige;
border-radius:20px;
padding:15px;
font-family:"babydollfont";
transition: 0.2s;}

.choices button:hover{transform:scale(1.03);}

.entry{background-color: beige;
padding: 20px;
border-radius: 20px;
margin-top: 20px;}

h2{font-family: "babydollfont";}

a{color:lightpink;
font-family:"babydollfont";
text-decoration:none;}

a:hover{color:palevioletred;}

hr{border:none;
height:2px;
background-color:palevioletred;
margin:30px 0;}

.splash{text-align:center;
margin-top:80px;}

.titleimage{width:500px;
max-width:90%;}

.enterbutton{display:inline-block;
margin-top:20px;
padding:15px 30px;
background-color:lightpink;
border-radius:20px;
text-decoration:none;
color:black;
font-family:"babydollfont";}

.enterbutton:hover{transform:scale(1.05);}


