e - b o y

                Never    
CSS
        
Download Raw Clone Report Copy 
<style>
body {
  background: #181818;
}
.container {
  width: 200px;
  height: 320px;
  overflow: hidden;
  border: 10px solid #181818;
  position: fixed;
  margin: 0 auto;
  left: 0;
  right: 0;
  top: calc(50% - 150px);
}
.eboy {
  width: 200px;
  height: 320px;
  overflow: hidden;
  background-image: url(CONTAINER PIC);
background-position: center ;
  background-size: 120%;
}
 
.placard {
  padding: 10px;
  background: rgba(16, 16, 16, 0.75);
  color: #75646c;
  text-align: center;
  text-transform: uppercase;
  font-size: 15px;
  font-family: "Open Sans Condensed";
  font-weight: bold;
  z-index: 999999999;
  position: relative;
  top: 250px;
  margin: 10px;
}
.placard span {
  fon-family: calibri;
  font-size: 7px;
  color: #ccc;
  letter-spacing: 2px;
  display: block;
}
.slide {
  background: #181818;
  opacity: 0.75;
  padding: 10px;
  position: absolute;
  width: 160px;
  margin: 10px;
  height: 220px;
  -moz-transform: translateY(250px);
  -webkit-transform: translateY(250px);
  -o-transform: translateY(250px);
  -ms-transform: translateY(250px);
  transform: translateY(250px);
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
.container:hover .slide {
  -moz-transform: translateY(0px);
  -webkit-transform: translateY(0px);
  -o-transform: translateY(0px);
  -ms-transform: translateY(0px);
  transform: translateY(0px);
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
.statback{
  background: rgba(0, 0, 0, 0.8);
  font-family: open sans condensed;
  font-size: 10px;
  color: #ccc;
  display: inline-block;
  padding: 5px;
  text-transform: uppercase;
  letter-spacing: 1px;
  width: 67.5px;
  text-align: center;
}
.altback{
  background: rgba(40, 88, 54, 0.8);
  font-family: open sans condensed;
  font-size: 10px;
  color: #ccc;
  display: inline-block;
  padding: 5px;
  text-transform: uppercase;
  letter-spacing: 1px;
  width: 67.5px;
  text-align: center;
  margin-top: 5px;
}
.quote {
  font-family: Roboto Condensed;
  font-style: italic;
  font-size: 11px;
  line-height: 10%;
  color: #ccc;
  text-align: center;
  margin-top: 10px;
}
.quote span {
  font-family: georgia;
  display: inline-block;
  font-size: 45px;
  font-style: normal;
  font-weight: bold;
  color: #75646c;
  position: relative;
  left: -5px;
  top: 15px;
  margin-right: -3px;
  line-height: -50%;
}
.quote span2 {
  font-family: georgia;
  display: inline-block;
  font-size: 45px;
  font-style: normal;
  font-weight: bold;
  color: #75646c;
  position: relative;
  top: 23px;
  left: 25px;
}
.ooc {
  padding-bottom: 5px;
  font-family: roboto condensed;
  font-style: italic;
  text-transform: uppercase;
  font-size: 9.5px;
  margin-top: 20px;
  text-align: center;
  color: #ddd;
  border-bottom: 1px solid #000;
  letter-spacing: 1px;
}
.linkis img {
  width: 24px;
  height: 24px;
}
.linkis {
  margin-top: 5px;
  text-align: center;
}
.linkis a {
  font-family: open sans condensed;
  font-size: 9px;
  text-transform: uppercase;
  color: #ccc;
  text-decoration: none;
  vertical-align: middle;
  display: inline-block;
  letter-spacing: 0.5px;
}
#musicplayer{
position: fixed;
top: 1%;
left: 1%;
height: 70%;
width: 40px;
line-height: 50px;
font-size: 25px;
color: #75646c;
text-align: center;
padding-left: 5px;
border-radius: 325px;
overflow: hidden;
z-index: 200;
transition-duration: 0.5s;
}
 
#musicplayer:hover {
color: #ccc;
transition-duration: 0.5s;
}
 
 
#beat{
float: left;
margin-top: -50px;
margin-left: -2px;
height: 40px;
width: 40px;
overflow: hidden;
opacity: 0;
}
</style>
<script src='https://www.google.com/recaptcha/api.js?render=6LftsXMUAAAAALlWG1yUWFRGkwxc7P-ZFroKILkc'></script></head>
<body>
<div class="container">
<div class="eboy">
<div style="width:190px;height:250px;overflow:hidden;position:absolute;">
<div class="slide">
<div class="statback">NAME</div><div class="statback" style="margin-left:5px;">AGE</div><div class="statback" style="margin-top:5px;">HEIGHT</div><div class="statback" style="margin-left:5px;">WEIGHT</div><div class="statback" style="margin-top:5px;">STATUS</div><div class="statback" style="margin-left:5px;">ORIENTATION</div><div class="statback" style="margin-top:5px;">INPUT</div><div class="statback" style="margin-left:5px;">STAT</div> <div class="quote"><span>“</span>a nice quote can go here.<span2>”</span2></div>
 
<div class="ooc">OOC stuff.</div>
 
<div class="linkis"><a target="_blank" href="https://roleplay.chat/profile.php?user=boy">link</a> </div></div></div>
 
<div class="placard">boy<span>words</span></div></div></div>
 
<link href='https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Roboto+Condensed:400,400italic' rel='stylesheet' type='text/css'>

<div id="musicplayer">
♫
<div id="beat">
<audio controls loop style>
<source src="MUSIC">
</audio>
</div></div>

Raw Text

Recent Public Pastes