Frame Title

<!DOCTYPE html>
<html>
<head><meta charset="us-ascii">
<title>Cute Rounded Button Layout from Sweetcharm.net</title>
<style type="text/css">

::-webkit-scrollbar-button {
background-color: #CDDED6;
width: 16px;
height: 16px;
border-radius: 8px;
}

/* Set the color for the entire scrollbar */
::-webkit-scrollbar {
width: 10px;
background-color: #fff;
}

/* Set the color for the scrollbar thumb */
::-webkit-scrollbar-thumb {
background-image: linear-gradient(to bottom, #FBFAF4, #F1BFC0);
border-radius: 8px; /* set border-radius to make it rounded */
}

/* Set the color for the scrollbar track */
::-webkit-scrollbar-track {
background-color: #fff;
}

.rounded-button,
.rounded-button2{
display:inline-block;
width:120px;
padding:10px;

text-align:center;
text-decoration:none;

border-radius:20px;

opacity:.8;

transition:
transform .25s ease,
opacity .25s ease,
color .25s ease;
}

.rounded-button{
background:#FFC8DD;
color:white;
}

.rounded-button2{
background:#FDC7EA;
color:#9966CC;
}

.rounded-button:hover,
.rounded-button2:hover{
opacity:1;
transform:translateX(-4px) scale(1.05);
color:#8C7165;
}
#Layer1{
position:absolute;
width:140px;
z-index:5;

left:885px;
top:145px;
}
#Layer2 {
position:absolute;
width:200px;
height:115px;
z-index:-10;
left: -5px;
top: -13px;
}
#Layer3 {
position:absolute;
width:454px;
z-index:2;
left:470px;
top:20px;

font-size:90px;
font-family:"Times New Roman", Times, serif;

color:#FAF9F5;

text-shadow:
-2px -2px 0 #F3C8C8,
2px -2px 0 #F3C8C8,
-2px 2px 0 #F3C8C8,
2px 2px 0 #F3C8C8,
0px 0px 12px rgba(255,255,255,.7);

animation: floatTitle 4s ease-in-out infinite;
}

#Layer3:hover{
transform:scale(1.03);
}

@keyframes floatTitle{
0% { transform:translateY(0px);}
50% { transform:translateY(-8px);}
100% { transform:translateY(0px);}
}
.style2 {
font-size: 90px;
color: #F8A8D9;
font-family: "Times New Roman", Times, serif;
}
#Layer4 {
position:absolute;
width:200px;
height:115px;
z-index:3;
left: 473px;
top: 144px;
}
body {
background-color: #FDE2E9;
}
#Layer5 {
position:absolute;
width:402px;
height:65px;
z-index:4;
left: 473px;
top: 693px;
}
.style3 {
color: #FF99CC;
font-size: 9px;
}
body,td,th {
color: #FF0099;
}
a:link {
color: #FFFFFF;
}
a:visited {
color: #FFFFFF;
}
a:hover {
color: #FEEECD;
}
</style>
</head>
<body>
<div id="Layer1">
<p align="right"><a class="rounded-button" href="https://sweetcharm.net/.CuteDesktop/VisitorYou/SOZAI/FreeLayouts/LolitaLayout/defaultframe.html" target="MAINFRAME">About</a></p>

<p align="right"><a class="rounded-button2" href="https://sweetcharm.net/.CuteDesktop/VisitorYou/SOZAI/FreeLayouts/LolitaLayout/defaultframe.html" target="MAINFRAME">Other</a></p>

<div id="Layer5">
<div align="right" class="style3">| layout by <a href="http://www.sweetcharm.net" target="_blank">sweetcharm.net</a> |</div>
</div>
</body>
</html>