Advanced 2 CSS

#profile-container {background:none;}body {background: #0a0a0c; cursor:url(http://cur.cursors-4u.net/cursors/cur-9/cur817.cur), auto;}

/* Alright so as you clearly know this is a template for you to use for a profile. However, to give the person who made it, and group some respect we ask that you do not decunstruct it or take things from it to make your other profiles. It was made the way it is and we would prefer that it stays in the same format. However, it is here for you to use and change pictures, text, color, so on so forth for your character. DO NOT remove the group page credit down below as this will be the only warning. If you do remove the credit you will be blasted on the next pages to come and will be labelled as a thief. Thankyou for respecting the wishes of the creators and have a nice day~ If you need help with the profile go to one of the mods and they will show you how to tinker it. */

h1{
padding: 5px;
font-size: 12.5px;
text-align: left;
color: #CBCBCB;
border-bottom: 2px solid #CBCBCB;
font-family: verdana;
}

p{
padding: 5px;
font-size: 12.5px;
text-align: justify;
color: #E5E5E5;
font-family: verdana;
}

.pic{
position: absolute;
top: 50px;
left: 245px;
background: url(http://i.imgur.com/rw5Z2PF.jpg) no-repeat;
background-size: cover;
height: 400px;
width: 272px;
border: 2px solid #fff;
z-index: 999;}

.base{
position: absolute;
top: 50px;
left: 2px;
background: #696870;
height: 400px;
width: 750px;
border: 2px solid #fff;}


.biography{
position: absolute;
top: 185px;
left: 7px;
background: #696870;
height: 260px;
width: 231px;
border: 2px solid #fff;
overflow: auto;}

.ooc{
position: absolute;
top: 185px;
left: 524px;
background: #696870;
height: 260px;
width: 223px;
border: 2px solid #fff;
overflow: auto;}


/* Stat blocks */

#switches{
  position: absolute;
  display: block;
  z-index: 6666;}

div.switch{
  position: relative;
  top: 56px;
  left: 4px;
  border: 2px solid #696870;
  display: inline-block;
  width: 105px;
  height: 14px;
  margin-bottom: 5px;
  font-family: verdana;
  font-size: 10px;
  letter-spacing: 1px;
  line-height: 13px;
  color: #FFF;
  padding: 2px;
  background: #0a0a0c;
  cursor:url(http://cur.cursors-4u.net/cursors/cur-9/cur817.cur), auto;
  background-size: 200% 100%;
  margin-left: 3px;
  margin-top: -2px;
  text-align: left;
-webkit-transition: all .2s ease;
-moz-transition: all .2s ease;
-o-transition: all .2s ease;}



div.switch:hover{
  border-left: 15px solid #ccc;
  border-right: 2px solid #ccc;
  width: 92.1px;
  font-size: 10px;
  letter-spacing: 0px;
  color:  #fff;}


span.answer {
    display: none;}

div.switch:hover span.question{
    display: none;}

div.switch:hover span.answer {
    display: inline-block;}

a:link, a:visited, a:active {
text-decoration: none;
color: #fefefe;
-moz-transition-duration: 0.5s;
-webkit-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
transition-duration: 0.5s; }

a:hover {
color:  #ccc;
cursor:url(http://cur.cursors-4u.net/cursors/cur-9/cur817.cur), auto; }


/* Gallery */

.gallery{
position: absolute;
top: 55px;
left: 521px;
height: 45px;
width: 330px;
background: none;
border: none;
z-index: 999;}

img{
height: 58px;
width: 49px;
background: none;
margin-left: 1px;
border: 2px solid #fff;
 -webkit-transition: all .7s ease-in-out;
-moz-transition: all .7s ease-in-out;
-o-transition: all .7s ease-in-out;}

img:hover{
border: 2px solid #ccc;
filter: hue-rotate(180deg);
-webkit-filter: hue-rotate(180deg);
-moz-filter: hue-rotate(180deg);
-o-filter: hue-rotate(180deg);
-ms-filter: hue-rotate(180deg)}


/* SCROLLBAR */

::-webkit-scrollbar {
  progress;
  width: 7px;}


::-webkit-scrollbar-thumb:vertical {
  background-color:  #ccc;
  border: 2px solid #fff;}


/* Remove this from the CSS or the HTML, you will be put on the group page and labelled as a thief. If you take this code/template you have to understand it is rude to remove the proper credit. */

.sxs {
position: fixed;
right: 10px;
bottom: 10px;
width: 15px;
height: 15px;
border: 2px solid #b1fcf9;
background:url(http://i578.photobucket.com/albums/ss226/funnycatrox/COLORYO-1.gif); }

.sxs:hover {
background: #279fcf; }

.sxs:after {
display: block;
margin: 0;
width: 0;
content: '';
-webkit-transition: width  .6s;
-moz-transition: width .6s;
transition: width .6s; }

.sxs:hover:after  {
float: right;
margin-top: 6px;
margin-right: 15px;
height: 2px;
width: 30px;
background: #b1fcf9; }

.sxs p {
position: absolute;
top: -1px;
left: -100px;
height: 14px;
width: 200px;
font-family: verdana;
font-size: 10px;
line-height: 13px;
text-align: center;
background: #279fcf;
border: 2px solid #b1fcf9;
opacity: 0;
-webkit-transition: all .6s ease-in-out;
-moz-transition: all .6s ease-in-out;
-o-transition: all .6s ease-in-out;  }

.sxs:hover p {
top: -7px;
left: -230px;
width: 200px;
opacity: 1; }