Tink 2.2 CSS

/* Custom profile for Tink by Vaellyth */

/* Scrollbars - will not work in Firefox */

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

::-webkit-scrollbar-track {
background: rgba(255, 255, 255, 0.8);
}

::-webkit-scrollbar-thumb {
background: rgba(113, 4, 43, 0.8);
}

* {
box-sizing: border-box;
cursor: url(http://cur.cursors-4u.net/cursors/cur-2/cur222.cur), progress !important;
transition: all .4s ease;
}

body {
background: url(http://i.imgur.com/ByWnAUv.png);
background-size: cover;
background-attachment: fixed;
}

/* Hidden Modules */
#content:before, #content:after, #likes, #dislikes, #hobbies, #friendlist, #comments img, #logo, #bio h2, li#view-wishlist {
display: none;
}

/* Text Styles */

@font-face {
  font-family: Give You Glory;
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/giveyouglory/v6/DFEWZFgGmfseyIdGRJAxuBcAUOYGvnPYlcaEKgTjjG0.woff2);
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

h2 {
font-family: Give You Glory;
font-weight: normal;
font-size: 32px;
color: #FFF;
}

a {
font-family: Give You Glory;
color: #FFF;
}

a:hover {
text-shadow: 0 0 2px;
}

a.delete.small {
color: #FFF !important;
width: 100% !important;
text-align: center;
float: right;
font-size: 10px;
}

/* Navigation Bar */

ul.navigation {
position: fixed;
margin: auto;
left: 0;
right: 0;
bottom: 0;
width: 100%;
border: 5px solid rgba(255, 255, 255, 0.8);
border-radius: 0;
border-bottom: hidden;
font-size: 16px;
background: url(http://i.imgur.com/8LaffFs.png);
background-size: cover;
}

ul.navigation li {
width: 25%;
}

ul.navigation li a {
color: rgba(255, 255, 255, 0.9);
}

ul.navigation li a:hover {
background: transparent;
}

#top-nav-home a:hover {
background: rgba(175, 42, 36, 0.8);
}

#top-nav-forum:hover {
background: rgba(235, 73, 45, 0.8);
}

#top-nav-shops:hover {
background: rgba(220, 161, 57, 0.8);
}

#top-nav-search:hover {
background: rgba(177, 54, 76, 0.8);
}

/* Modules */

#wrap {
width: 800px;
height: 630px;
position: relative;
top: -50px;
background: transparent;
border: none;
}

#content {
width: 100%;
height: 100%;
z-index: 1;
background: transparent;
border: none;
}

#sidebar, #bio, #comments {
position: absolute;
margin: auto;
left: 0px;
right: 0px;
border: 5px solid rgba(255, 255, 255, 0.8);
box-shadow: 0 0 5px 2px rgba(255, 255, 255, 0.5);
}

#sidebar {
width: 200px;
height: 300px;
z-index: 2;
top: 160px;
background: url(http://i.imgur.com/NAz2ZZF.png);
}

#sidebar img {
margin: auto;
position: relative;
left: 5px;
top: 10px;
}

#actions {
position: relative;
top: -280px;
left: 225px;
text-align: center;
opacity: 0;
color: rgba(255, 255, 255, 0.8);
}

li#send-message {
background: url(http://i.imgur.com/1gTGuKd.png);
}

li#view-posts {
background: url(http://i.imgur.com/R4RIAf7.png);
}

li#view-topics {
background: url(http://i.imgur.com/IIm4Vn4.png);
}

#sidebar:hover #actions, #actions:hover {
opacity: 1;
}

#actions li {
border: 5px solid rgba(255, 255, 255, 0.8);
box-shadow: 0 0 5px 2px rgba(255, 255, 255, 0.4);
font-family: Give You Glory;
font-size: 16px;
margin: 8px auto;
}

@keyframes headerglow {
0%, 100% { color: rgb(255, 255, 255); }
25% { color: rgb(0, 96, 113); }
50% { color: rgb(129, 28, 80); }
75% { color: rgb(162, 238, 8); }
}

#sidebar h2 {
position: absolute;
margin: auto;
left: 0px;
right: 0px;
top: -50px;
text-align: center;
font-size: 42px;
animation: headerglow 4s infinite;
text-shadow: 0 0 5px rgba(255, 255, 255, 0.8);
}

#bio {
width: 200px;
height: 300px;
top: 310px;
left: 450px;
background: url(http://i.imgur.com/SW5M8WD.png);
overflow-y: auto;
color: #FFF;
font-size: 11px;
}

#bio strong {
font-size: 15px;
text-shadow: 0 0 2px;
font-family: Give You Glory;
}

#bio img {
transform: scale(0.7);
}

#comments {
width: 200px;
height: 300px;
right: 450px;
color: transparent;
background: url(http://i.imgur.com/mjoaPYC.png);
overflow-y: auto;
}

#comments:hover {
height: 600px;
}

#comments h2 {
font-size: 22px;
text-align: center;
}

#comment_list li {
padding: 5px;
}

#comment_list li:hover {
background: rgba(113, 4, 43, 0.8);
}

#comment_list li a {
float: left;
width: 100%;
text-align: center;
}

#comment_list li:nth-child(2n+0):hover {
background: rgba(91, 235, 188, 0.8);
}

#comment_list li:nth-child(3n+0):hover {
background: rgba(104, 142, 38, 0.8);
}

#comment_list li p {
color: #FFF;
font-size: 11px;
}

#comments form {
width: 100%;
}

#comments form span, span#charsLeft { display: none; }

textarea {
width: 100%;
margin: 5px auto;
background: rgba(255, 255, 255, 0.8);
color: rgb(113, 4, 43);
font: 13px Give You Glory;
font-weight: bold;
}

#comment-button, #load-more {
width: 50%;
font-family: Give You Glory;
background: rgba(255, 255, 255, 0.8);
font-weight: bold;
border: none;
color: #FFF;
}

#comment-button:hover {
background: rgba(91, 235, 188, 0.6);
text-shadow: 0 0 2px;
}

#load-more {
float: right;
position: relative;
top: 92px;
}

#load-more:hover {
background: rgba(104, 142, 38, 0.6);
text-shadow: 0 0 2px;
}

/* end custom profile */