Sponsors

Highlighted

Fly of Simca by ~pvc24  1 week 3 days  ago

Fly of Simca by ~pvc24 1 week 3 days ago

^Dias
The amount of patience, hard work and an eye for quality is what defines this wallpaper. Character is painstakingly vectored off a real life toy image with references to screenshots. Despite the difficulty level, ~pvc24 still manages to nicely depict the image in anime fashion and yet able to find the mental strength to come up with a background composition that is both aptly fun and pleasant in atmosphere.

ShoutBox

°akiranyo 11 seconds ago
Or cheeseburger? ;3

~Zyd 1 minute ago
Got milk? (XD) emoticon

^hatesyou 2 minutes ago
Not asleep as such. Just being a rude, disinterested cow.

~Zyd 4 minutes ago
Busy with ceiling cat perhaps?

$Brad-M13 4 minutes ago
Hehe indeed.

°akiranyo 4 minutes ago
Pssst...she is asleep :3

~Zyd 7 minutes ago
Hey Kath :3

°akiranyo 8 minutes ago
Zyd: they are mostly in the capital, you was on the other side XD.

^hatesyou 8 minutes ago
ZzZz

~Zyd 9 minutes ago
@aki: she's Lithuanian xD I didn't see many pretty local girls though

AP4 CSS Customization instructions 1.2

user avatar
*Mrchak
Community Member
Orchestra the rhytm and the drum
Topics: 25
Posts: 338
2 years 5 months ago
Ok i needed 3 hours to figure what is what so here you go the official PimpMyUserpage Style userpage tut for changing colors on your plane old boring userpage ^^

I have some spelling mistakes but you will understand it... This has been written so that every idiot (as myself) can understand :P


/*
--------------------------------------------------------------------------------
AnimePaper CSS TEMPLATE
Designed By: Aaron Tan (xenohawk)
Last Update: 11:40 PM Friday, January 27, 2006
Description: VerticalEdge [fixed] [center]
URL: http://www.animepaper.net/
--------------------------------------------------------------------------------
+++ NOTICE +++
CSS is still under development.
A simpler CSS will be up once I have finished all the small parts
in APv4.

*/

/* IMPORT CORE CSS */
/* Depreciated, using external link on main page to load the core.css
@import url(http://www.animepaper.net:8080/css/core.css); */

/*
------------------------------------------------------------------------------
=essentials
------------------------------------------------------------------------------*/

body {
background: #E3E2E0 url(http://www.animepaper.net:8080/images/verticaledge/shadowbg.gif) repeat-y top center;
font-family: Verdana, sans-serif;/*Fonts in general*/
color: #888; }/*Color of the fonts on the whole page*/

blockquote { background: #FFF; }

blockquote span.bhead {
display: block;
background: #CCCCCC;
padding: 4px 1em;
font-weight: bold;
color: #FFF; }

blockquote div {
border-left: 4px solid #CCCCCC;
border-right: 4px solid #CCCCCC;
border-bottom: 4px solid #CCCCCC;
padding: 1em; }

blockquote.spoiler span.bhead {
cursor: pointer; }

blockquote.spoiler div { display: none; }

ins { text-decoration: none; color: #B96A0E; }

pre, code { color: #6F4109; }


/* =essentials_links
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

a:link,
a:visited,
a:active {
text-decoration: none;
color: #3399CC; }/*color of the links on the whole page*/

a:hover {
text-decoration: none;
color: #B32FCF; }/*color of the links while hover*/

a:hover img { border: none; }



/* =essential_misc
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/* Turn off active outline for browser that support (e.g. Firefox 1.5) */
* { outline: 0; }




/*
------------------------------------------------------------------------------
=typography
------------------------------------------------------------------------------*/

p, label, .normalsize { font-size: 1.1em; line-height: 1.5em; }
ul, ol, dl { font-size: 1.1em; line-height: 1.5em; }
q { font-size: 1.1em; line-height: 1.5em; }

/* Cancel off font inheritance to childrens */
ul ul, ol ol, ol ul, ul ol, dl dl, li p, p q { font-size: 1em; }

h1, .hugesize { font-size: 2.6em; }
h2, .largesize { font-size: 2.2em; }
h3 { font-size: 1.8em; }
h4 { font-size: 1.6em; }
h5, .mediumsize { font-size: 1.4em; }
h6 { font-size: 1.2em; }

h1, h2, h3 { margin: 0; }


/* =typography_custom
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

p { }

p.centered { text-align: center; }

p.nm, p.wm {
margin: 0 0 1em 0;
padding: 3px; }

p.nm {
background-color: #FEF5DA; /*if you see the quotebox "ne scan has been submitted... thats the color of the background*/
border-right: 1px solid #D0CBAF;/*border*/
border-bottom: 1px solid #D0CBAF; /*border*/
color: #605033; }/*color of the font in it*/

p.wm {
background-color: #FBD8D7;
border-right: 1px solid #DCBFB4;
border-bottom: 1px solid #DCBFB4;
color: #6A0D0B; }

p.priority {
text-align: center;
font-weight:bold; }

p.subs {
margin: 0 0 1em 0; }

h2 { }

.sections h2, .subsections h2 {
border-top: 3px solid #DDD;/*this is the border that devides the whole categories*/
margin: 25px 0 20px 0;
font-size: 1.3em;/*this is the size of the font on the title of the categories default green*/
font-weight: bold;
letter-spacing: 1px;
line-height: 2em;
color: #8BBD17; }/*the color of the titles*/

.sections h2 span {
display: block;
margin-top: -1em;
font-size: 10px;
font-weight: normal;
letter-spacing: 1px;
color: #CCC; }

h3 { }

#sidebar h3, .subsections h3, #write_form h3 {
border-top: 3px solid #DDDDDD;
margin: 25px 0 20px 0;
font-size: 1.3em;
font-weight: bold;
letter-spacing: 1px;
line-height: 2em;
color: #B32FCF; }/*title color of the categories on the sidebar*/

.subsections h3 a { color: #B32FCF; }

.generic_box h3, .option_box h3 {
background: #EEE;/*color of some titles in the sidebar (can be seen on the home page)*/
border: 0;
margin: 0; padding: 5px;
font-size: 1.1em;
font-weight: bold;
letter-spacing: normal;
line-height: 1.2em;
color: #666; }/*font in those titles*/

#write_form h3 {
border: 0;
margin: 0 0 1em 0; padding: 5px;
border-bottom: 2px solid #DDDDDD;
color: #666; }




/*
------------------------------------------------------------------------------
=navigation
------------------------------------------------------------------------------*/

#navigation { position: absolute; width: 100%; z-index: 9999; }
#nav {
position: relative;
height: 32px;/*you can adjust the position of the border downward by entering larger number*/
margin: 0;
border-bottom: 5px solid #EEE;/*on the navigation this is the color of the lower border*/
list-style: none;
padding-top: 2px; }

#nav ul, #nav li { list-style: none; margin:0; }

#nav li.on { text-indent: -5000px; }

#nav li.on ul {
background: #CCC;/*this is the whole navigation bar color (behind everything)*/
position: absolute;
top: 2px; left: 0;
width: 100%;
height: 30px;
text-indent: 0;
margin-bottom: 2px; }

#nav li.on ul li { float: left; }

#nav li.on ul li a {
background: #CCC;/*the color of the navigation buttons*/
display: block;
height: 30px;
width: 80px;
border-right: 2px solid #FCFBF9;/*the color of the border between the buttons*/
padding-left: 4px;
font-size: 11px;
font-weight: bold;
color: white; }/*color of the fonts on the navigation bar*/

#nav li.on ul li a:hover { background: #8BBD17; }/*color of the button when hover*/

#nav li.off {
position: relative;
float: right;
top: 35px; right: 4px;
height: 20px;
margin-top: -1.5em; }

#nav li.off a {
background: #EEE url(http://www.animepaper.net:8080/images/verticaledge/arrow_down_light.gif) no-repeat 98% 50%;/*color of the drop down menu on the right*/
display: block;
width: 14em;
line-height: 20px;
padding-left: 4px;
margin-left: 4px;
border: 1px solid #E0E0E0; /*the border color of the drop down menu*/
border-top: 0;
font-size: 10px;
font-weight: bold;
color: #AAA; }/*color of "quick"*/

#nav li.off a:hover, #nav li.off:hover a, #nav li.sfhover a {
background: #EEE url(http://www.animepaper.net:8080/images/verticaledge/arrow_down.gif) no-repeat 98% 50%;/*color of the "quick menu" when hover*/
color: #666; }/*color of the font when hover*/

#nav li.off ul {
display: none;
position: absolute;
top: 20px; left: 0; }

#nav li.off:hover ul, #nav li.sfhover ul {
display: block;
z-index: 5000; }

#nav li.off:hover ul li a, #nav li.sfhover ul li a {
background: #CCC;/*color of the navigation bar when hover*/
color: #FFF; }/*font color when hover*/

#nav li.off ul li a:hover {
background: #BE4DD7; /*color of the links when hover in the quick menu*/
color: #FFF; }/*color of the font when hover in quick menu*/


/* =navigation_tab
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*well TABS you can see them in the messages*/
ul.tab_menu {
margin:0 0 1em 0; padding: 0;
border-bottom: 7px solid #EEE;/*this is the border color below the tabs*/
list-style: none; }

ul.tab_menu li {
margin: 0 0 -2px 0; padding: 0;
float: left; }

ul.tab_menu li a,
ul.tab_menu li a:visited {
background: #EEE;/*bacground color of the tabs*/
display: block;
padding: 3px 10px;
margin-left: 5px;
margin-right: 0;
font-weight: bold;
border: 1px solid #E0E0E0;/*tabs border*/
border-bottom: 0;
color: #AAA; }/*color of the font on the tabs*/

ul.tab_menu li a:hover, ul.tab_menu li.selected a,
ul.tab_menu li.selected a:visited {
color: #666; }/*visited font color on the tabs menu*/




/*
------------------------------------------------------------------------------
=list
------------------------------------------------------------------------------*/


/* =list_images
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

li.icon_new { background: transparent url(http://www.animepaper.net:8080/images/icons/note.gif) no-repeat 0 50%; }
li.icon_zoom { background: transparent url(http://www.animepaper.net:8080/images/icons/zoom_in.gif) no-repeat 0 50%; }
li.icon_down { background: transparent url(http://www.animepaper.net:8080/images/icons/arrow_down.gif) no-repeat 0 50%; }
li.icon_fav { background: transparent url(http://www.animepaper.net:8080/images/icons/heart_add.gif) no-repeat 0 50%; }
li.icon_favdel { background: transparent url(http://www.animepaper.net:8080/images/icons/heart_delete.gif) no-repeat 0 50%; }
li.icon_edit { background: transparent url(http://www.animepaper.net:8080/images/icons/pencil.gif) no-repeat 0 50%; }
li.icon_del { background: transparent url(http://www.animepaper.net:8080/images/icons/bin_closed.gif) no-repeat 0 50%; }
li.icon_stop { background: transparent url(http://www.animepaper.net:8080/images/icons/stop.gif) no-repeat 0 50%; }
li.icon_feat { background: transparent url(http://www.animepaper.net:8080/images/icons/star.gif) no-repeat 0 50%; }
li.icon_top { background: transparent url(http://www.animepaper.net:8080/images/icons/arrow_up.gif) no-repeat 0 50%; }
li.icon_add_showcase { background: transparent url(http://www.animepaper.net:8080/images/icons/image_add.gif) no-repeat 0 50%; }
li.icon_remove_showcase { background: transparent url(http://www.animepaper.net:8080/images/icons/image_delete.gif) no-repeat 0 50%; }
li.icon_most_popular { background: transparent url(http://www.animepaper.net:8080/images/icons/folder_heart.gif) no-repeat 0 50%; }
li.icon_wallpaper_timeline { background: transparent url(http://www.animepaper.net/images/icons/clock.gif) no-repeat 0 50%; }
li.icon_friend_submissions { background: transparent url(http://www.animepaper.net:8080/images/icons/folder_user.gif) no-repeat 0 50%; }
li.icon_my_scans { background: transparent url(http://www.animepaper.net:8080/images/icons/image.gif) no-repeat 0 50%; }
li.icon_my_wallpapers { background: transparent url(http://www.animepaper.net:8080/images/icons/image.gif) no-repeat 0 50%; }
li.icon_random_cat { background: transparent url(http://www.animepaper.net:8080/images/icons/photos.gif) no-repeat 0 50%; }
li.icon_random_gallery { background: transparent url(http://www.animepaper.net:8080/images/icons/images.gif) no-repeat 0 50%; }
li.icon_random_scans { background: transparent url(http://www.animepaper.net:8080/images/icons/photo.gif) no-repeat 0 50%; }
li.icon_random_wallpapers { background: transparent url(http://www.animepaper.net:8080/images/icons/photo.gif) no-repeat 0 50%; }
li.icon_friend { background: transparent url(http://www.animepaper.net:8080/images/icons/user.gif) no-repeat 0 50%; }
li.icon_stylesheet { background: transparent url(http://www.animepaper.net:8080/images/icons/layout_content.png) no-repeat 0 25%; }

/* For big icons use in the list_menu_view
dt.icon_big_wallpaper a { background: transparent url(http://www.animepaper.net:8080/images/tango-icons/wallpaper.gif) no-repeat 7px 50%; }
dt.icon_big_scan a { background: transparent url(http://www.animepaper.net:8080/images/tango-icons/wallpaper.gif) no-repeat 7px 50%; }
dt.icon_big_fav a { background: transparent url(http://www.animepaper.net:8080/images/tango-icons/favorite.gif) no-repeat 7px 50%; }
*/

dt.page_label { background: transparent url(http://www.animepaper.net:8080/images/icons/page_copy.gif) no-repeat 0 50%; }
dt.topic_started_label, dt.last_activity_label { background: transparent url(http://www.animepaper.net:8080/images/icons/time.gif) no-repeat 0 50%; }
dt.last_reply_label, dt.by_label { background: transparent url(http://www.animepaper.net:8080/images/icons/user_comment.gif) no-repeat 0 50%; }

dd.topic_content { background: transparent url(http://www.animepaper.net:8080/images/icons/resultset_next.gif) no-repeat 0 50%; }


/* =list_one
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- outer template right sidebar 'Links' list.
*/

.list_one { margin: 0; font-size: 1em; }

.list_one li {
margin: 0 5px;
list-style: none; }

.list_one li a {
display: block;
background: transparent url(http://www.animepaper.net:8080/images/verticaledge/arrow_bullet.gif) no-repeat 0 50%;
padding-left: 20px;
border-bottom: 1px solid #DDDDDD;/*border below the links on the home page*/
line-height: 2em;
height: 2em; }

.list_one li a:hover { border-bottom: 1px solid #8BBD17; }/*the same border when hover*/

/* =list_two
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- usually used on the footer of the content box (e.g. 'see more' link..)
*/

.list_two { margin: 0; font-size: 1em; }

.list_two li {
margin: 0 5px;
padding-left: 20px;
line-height: 2.5em;
list-style: none; }

.list_two li.site img {
display: block;
margin-top: 1.5em;
margin-left: auto;
margin-right: auto; }


/* =list_three
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- gallery index page list like 'Gallery Options'
*/

.list_three { margin: 0; font-size: 1.4em; }

.list_three li {
margin: 0 10px;
list-style: none;
padding-left: 25px;
line-height: 2em;
height: 2em; }

.list_three li a {
font-weight: bold; }


/* =list_four
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- CSS style selection and creation
*/

.list_four { margin: 0; font-size: 1.4em; }

.list_four li {
margin: 0 10px 10px 0;
list-style: none;
padding-left: 25px;
height: 2.5em }

.list_four li a {
font-weight: bold; }

.list_four li p {
position: relative;
top: -1.2em;
display:block;
font-size:0.8em;
height:0.8em; }


/* =list_block
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- link us page
*/

.list_block { margin: 0; }

.list_block li {
margin: 5px 10px;
list-style: none;
padding-left: 25px; }

/* =list_img
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- list with inline image (userpage sidebar lists eg. myfriends.. )
*/

.list_img { margin: 0; font-size: 1em; }

.list_img li {
position: relative;
margin: 0 5px;
padding: 0 20px 0 2px;
line-height: 2.3em;
height: 2.3em;
border-bottom: 1px solid #DDDDDD;/*border color between friends in friend list*/
list-style: none; }

.list_img li img {
position: absolute;
top: 4px; right: 2px; }

.list_img li:hover { border-bottom: 1px solid #8BBD17; }/*color of border when friend hover*/


/* =list_horizontal
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- list that requires horizontal positioning
-- gallery category listing index
*/

.list_horizontal { margin: 0; font-size: 1em; }

.list_horizontal li {
display: inline;
margin: 5px;
list-style: none;
line-height: 2em;
height: 2em; }

.list_horizontal li a {
font-weight: bold; }




/* =list_stats
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- list for statistical listings
-- stats pages
*/

.list_stats { margin: 0; padding: 0; }

.list_stats li {
background: #E8EEFA;
position: relative;
margin: 0 0 -0.1em 0;
padding: 1em 0 1em 10px;
border-top: 1px solid #DDD;
border-bottom: 1px solid #DDD;
list-style: none;
font-size: 1.5em; }

.list_stats li .image_div {
margin-top: 10px; }

.list_stats li span.avatar {
display: block;
margin-bottom: 5px; }

.list_stats li span.numbers,
.list_stats li span.rating {
position: absolute;
top: 15px; right: 10px;
font-weight: bold;
font-size: 25px;
color: #8BBD17; }

.list_stats li span.rating {
right: 80px;
padding-left: 15px;
font-size: 20px; }

.list_stats li span.rating span {
display: none; }
.list_stats li span.up {
background: transparent url(http://www.animepaper.net:8080/images/icons/rank_up.gif) no-repeat 0 100%;
color: green; }
.list_stats li span.down {
background: transparent url(http://www.animepaper.net:8080/images/icons/rank_down.gif) no-repeat 0 100%;
color: red; }

.list_stats li span.details {
position: relative; }



/* =list_showcase_info
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- gallery detail page showcase information (those info you see on your left)
-- admin approve page
-- userpage details
*/

dl.showcase_info {
line-height: 2em;
margin: 1em 0;
border-top: 1px solid #DDD;
color: #BBB; }

dl.showcase_info dt {
display: block;
width: 100px;
float: left;
padding-left: 5px;
border-bottom: 1px solid #DDD; }/*color of the border age/gender...*/

dl.showcase_info dd {
border-bottom: 1px solid #DDD;/*color of the border with your info*/
font-weight: bold; }


/* =list_topic_view
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- any forum/topic view like
*/

dl.topic_view,
dl.topic_view dt,
dl.topic_view dd { margin: 0; }
dl.topic_view dt.topic_label,
dl.topic_view dt.desc_label,
dl.topic_view dt.reply_label,
dl.topic_view dt.topics_label,
dl.topic_view dt.posts_label { display: none }

dl.topic_view {
position: relative;
background-color: #FEF5DA;
padding: 10px 80px 11px 10px;
margin-top: -0.1em; /* fix for 1px rouding error problem */
border-top: 1px solid #DDD;/*border color between topics*/
border-bottom: 1px solid #DDD;/*bottom border color of the topics*/
line-height: 1.8em; }

dl.topic_index {
background-color: #E8EEFA;/*forum topic background color*/
padding-right: 155px; }

dl.sticky_topic {
background-color: #FCE3E2; }/*background color of the sticky topic*/

dl.topic_view dt {
position: relative;
float: left;
padding-right: .5em;
padding-left: 20px; }

dl.topic_view dd {
display: block; }

dl.topic_view dd.topic_content {
display: block;
padding-left: 20px;
font-size: 1.2em;
font-weight: bold; }

dl.topic_view dd.desc_content {
display: block;
padding-left: 20px;
margin-bottom: 1em;
line-height: 1.5em; }

dl.topic_view dd.reply_content, dl.topic_view dd.topics_content,
dl.topic_view dd.posts_content {
position: absolute;
top: 5px;
width: 60px;
margin: 0;
padding: 5px;
text-align: center;
font-weight: bold;
color: #8BBD17; }/*color of number of posts*/

dl.topic_view dd.topics_content { color: #698E11; }/*color of number of topics*/

dl.topic_view dd.reply_content span, dl.topic_view dd.topics_content span,
dl.topic_view dd.posts_content span { display: block; }

dl.topic_view dd.reply_content span { font-size: 1.5em; }

dl.topic_view dd.topics_content span,
dl.topic_view dd.posts_content span { font-size: 1.3em; }

dl.topic_view dd.reply_content, dl.topic_view dd.posts_content { right: 5px; line-height: 1.5em; }

dl.topic_view dd.topics_content { right: 75px; line-height: 1.5em; }


/* =list_menu_view
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- big list menu used on profile, gallery index...
*/

dl.menu_view, dl.menu_view dt,
dl.menu_view dd {
margin:0; padding: 0; }

dl.menu_view dt a {
display: block;
clear: both;
background-color: #E8EEFA;/*color of the links to your controls*/
height: 3.5em;
padding-top: .5em;
padding-left: 10px; /* Increase the value here if there is icon */
margin-top: -1px; /* fix for 1px rouding error problem for IE */
border-top: 1px solid #DDD;
border-bottom: 1px solid #DDD;
font-size: 1.4em;
font-weight: bold;
letter-spacing: 1px; }
html > body dl.menu_view dt a {
margin-top: 0;
/* fix for 1px rouding error problem for modern browser */
margin-bottom: -1px; }

dl.menu_view dd {
display: inline;
float: left;
position: relative;
top: -1.7em;
margin-top: -1.8em;
margin-left: 10px; } /* Increase the value here if there is icon */
html > body dl.menu_view dd {
top: -1.4em; }


/* Compact version - used in userpage */
dl.menu_view.compact dt a {
font-size: 1.3em;
height: 2.8em; }

dl.menu_view.compact dd {
margin-top: -1.8em;
top: -0.4em; }
html > body dl.menu_view.compact dd {
top: -0.3em; }





/*
------------------------------------------------------------------------------
=forms
------------------------------------------------------------------------------*/

fieldset { margin: 0; border: 0; padding: 0; }
legend { display: none; }
input, textarea { font-size: 1em; padding: 1px; }
textarea { display: block; margin: 0; padding: 2px; }

form { }

form p {
margin-left: 0;
margin-right: 0; }

form label {
display: block;
margin-top: 0;
margin-left: 0;
margin-bottom: 3px;
font-size: 1em;
font-weight: bold; }

form label em { font-weight: normal; }

form input {
backfround: #fff;/*color of the writing box on the shoutbox, searchbox...*/
display: block;
margin-top: 3px;
font-weight: normal; }

form select {
display: block;
margin-top: 3px;
line-height: 1.5em;
font-size: 1em;
font-weight: normal; }

form textarea {
margin-top: 3px;
line-height: 1.5em; }


/* =form_input
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

input.input_text, input.input_file, select, option, textarea {
font-family: Verdana, sans-serif;
color: #555; }/*color of the font when writing*/

input.input_btn_big {
margin-top: 2em;
padding: 5px 20px;
font-size: 1.2em;
font-weight: bold; }

input.input_checkbox, input.input_radiobox, .inline_input select { display: inline; }

input.input_radiobox { margin-bottom: -0.1em; }

input.input_large { font-size: 1.6em; }


/* =form_input_inline
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

p.inline_input strong,
p.inline_input label { display: inline; padding-right: 1em; }

p.inline_nospace label { padding-right: 0; }

label.inline_input { margin-bottom: 0; }

label.inline_input span { padding-right: 10px; font-weight: bold; }

label.inline_input input, p.inline_input input {
display: inline;
margin-top: 0; }

label.inline_input input { line-height: 1em; }


/* =form_input_indicator
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.indicator {
background: transparent url(http://www.animepaper.net:8080/images/indicator.gif) no-repeat top left;
display: block;
position: relative;
top: -25px; left: 5px;
height: 16px; width: 16px;
margin-bottom: -16px; }





/*
------------------------------------------------------------------------------
=layout
------------------------------------------------------------------------------*/


/* =layout_framework
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- basic foundation for the layouts, effects all layouts
*/

#stretch {
background: #FCFBF9;/*the background color of the whole page*/
margin: 0 auto;
padding: 0;
width: 960px; }

#container {
/*background: transparent url(http://www.animepaper.net:8080/images/920_grid.gif) repeat-y left top;*/
margin: 0 auto; width: 920px;
position: relative;
text-align: left; }

/* Holly hack for IE \*/
* html #stretch,
* html #container { height: 0; }
/* */

/* Helps get IE internal percentage correct */
#wrapper { width: 100%; }

#sidebar {
width: 230px;
float: right;
display: inline; }

#content {
width: 690px;
float: left;
display: inline;
text-align: left; }

#content_inner { width: 100%; }

#header_wrapper, #footer_wrapper {
margin: 0 auto;
width: 960px; }

#header, #footer {
margin: 0 auto;
width: 920px; }

#footer { padding: 5px 0; }


/* =layout_framework_columns
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- basic grid column foundation for the layouts, effects all layouts
*/

.single_col {
clear: both;
width: 680px; }

.first_col {
float: left;
width: 335px;
margin-right: 10px; }

.second_col {
float: left;
width: 335px; }

.twin_col_left {
float: left;
width: 345px; }

.twin_col_right {
float: left;
width: 335px; }


/* =layout_class
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- general class used throughout multiples templates
*/

.centered { text-align: center; }
.subsections { margin-bottom: 1em; }


/* =layout_class_link_box
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- links button like on the forums, bbcodes...
*/

.link_box a:link,
.link_box a:visited,
.link_box a:active {
background: #EEE;/*color of some buttons like quote*/
border: 1px solid #E0E0E0;/*border of that button*/
padding: 3px 5px;
line-height: 2em;
color: #AAA; }/*color of the font*/

.link_box a:hover { color: #666; }/*color of the font when hover*/


/* =layout_class_image_div
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- thumbnail images...
*/

.image_div {
position: relative;
margin-bottom: 10px;
z-index: 500; }

.image_div img {
background: #FFF; /*bordr color around the images*/
padding: 2px;
border: 1px solid #DDDDDD; }/*border around border*/

.image_div a:hover img {
background: #DDDDDD; /*border color when hover*/
padding: 2px;
border: 1px solid #DDDDDD; }/*border of the border color when hover*/

.image_div a span {
display:block;
position: absolute;
top: 0; left:0;
width: 110px;
margin-top: 0px;
margin-left: 210px;
font-size: 10px;
text-align: left;
color:#999;/*color of the font nest to the image "by somemember"*/
cursor: pointer; }

/* Use for square thumbnails */
.image_div a span.square {
width: 230px;
margin-left: 90px; }

.image_div a span em {
display: block;
margin-bottom: 1em;
font-style: normal;
font-weight: bold; }

.image_div a span br { display: none; }

.image_div a span strong {
display: block;
margin-bottom: 2px;
line-height: 1.2em;
letter-spacing: 1px;
margin-bottom: 0.5em;
color: #3399CC; }/*color of the name of the image*/

.image_div a:hover span strong {
color: #B32FCF; }/*color of the image name when hover*/

/* when image_div require horizontal positioning */
.image_div_hor {
display: block;
width: 330px;
float: left;
height: 170px; }

html > body .image_div_hor { height: auto; min-height: 170px; }


/* =layout_class_generic_box
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- foundation for box-like type content like frontpage news...
*/

.generic_box ul {
margin: 0;
list-style: none;
font-size: 10px; }

.generic_box .meta_header li {
margin: 0 5px;
color: #CCC; }/*the color of the small text below the subcategory (can be seen in gallery)*/

.generic_box .body {
margin-left: 5px;
margin-right: 5px;
font-size: 1.1em;
line-height: 1.5em; }

.generic_box p {
margin-left: 0;
margin-right: 0;
font-size: 1.0em;
text-align: justify; }

.generic_box .meta_footer li {
margin: 5px; margin-bottom: 0;
text-align: left; }


/* =layout_class_post_box
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Inherit: [ .generic_box ]
Used on:
-- posts in forums, comments...
-- userpages (about & custom) and groups (about) too
*/

.post_box {
background-color: #F4F4F4; /*color of the posts*/
border-top: 4px solid #DDD;/*border color*/
border-bottom: 4px solid #DDD;/*border color*/
margin: 4em 0;
z-index: 5000;
}

.post_box .meta_header ul { z-index: 9999; }

.post_box .meta_header ul {
position: relative;
width: 120px;
float: left;
margin: 0; padding: 5px;
border-top: 0; }

* html .post_box .meta_header ul { padding-bottom: 0; font-size: 1em;}

.post_box .meta_header li { margin: 0; padding: 0; color: #AAA; }/*color of the font for the member title below the avatar*/
.post_box .meta_header li.avatar { display: block; }
.post_box .meta_header li img { display: block; margin: 0 auto; }

.post_box .meta_header li.info {
text-align: center;
margin-bottom: 5px; }

.post_box .meta_header li.name {
position: absolute;
top: -1.03em; left: 0;
width: 400px;
font-size: 1.8em;
font-weight: bold;
letter-spacing: 1px;
margin-left: 0;
color: #AAA; }/*color of the icon for the member status*/

.post_box .meta_header li.name a { color: #AAA; }/*color of the member name*/
.post_box .meta_header li.name a:hover { color: #BE4DD7; }/*color of the member name when hover*/

.post_box .body {
position: relative;
margin-left: 130px;
margin-right: 0;
padding: 5px; }

.post_box .body .inner { overflow: auto; } /* Fix overflowing contents */
/* Argghh.. that's it IE.. TAKE THIS, now who's your daddy? */
* html .post_box .body .inner { width: 510px; }

.meta_wrap .body { margin-left: 0; }
.meta_wrap .body .inner { overflow: visible; }
* html .meta_wrap .body .inner { width: 640px; }

.meta_wrap .meta_header ul { margin-bottom: -1em; }


.post_box .meta_footer {
clear: left;
border-bottom: 1px solid #DDD;/*color of the thin border on the botton of the post*/
margin: 10px 0 1px 0; }

.post_box .meta_footer ul {
border-top: 1px solid #DDD; /*color of the border between comment and signature*/
margin: 0; }

.post_box .meta_footer li {
margin-bottom: 1em;
font-size: 1em;
text-align: center;
color: #AAA; }/*font color of time display*/

.post_box .meta_footer .options { padding-right: 5px; }

.post_box .meta_footer .options li {
float: right;
margin: 1em 0 1em 0;
padding: 0 5px;
border-left: 1px solid #DDD;/*border color between the quote, edit etc buttons on the post*/
height: 2em; }

.post_box .meta_footer .options li.attention_box {
border: 0;
font-weight: bold; }


/* =layout_class_handle
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Inherit: [ .generic_box ], [ .post_box ]
Used on:
-- collapsible box contents like the news in frontpage and options in gallery details
*/

.handle { cursor: pointer; }

.bar {
display: block;
overflow: hidden; }

/* Holly hack for IE \*/
* html .bar { height: 1%; }
/* */

/* handle styles on subsections h3 */
.subsections h3.open {
background: #EEE url(http://www.animepaper.net:8080/images/verticaledge/arrow_down.gif) no-repeat 99% 50%; }/*the color of the bar that when you clik on it it goes up or down. This is when it is opened*/

.subsections h3.closed {
background: #EEE url(http://www.animepaper.net:8080/images/verticaledge/arrow_up.gif) no-repeat 99% 50%; }/*the same when it is closed*/

.bar_closed {
display: none;
overflow: hidden; }


/* =layout_class_header_info_and_pager
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- pages that uses headers and paging information
*/

.header_info, .pager {
margin: 10px 0;
padding: 5px 15px;
border-top: 1px solid #DDD; /*color of the upper border for scrolling the posts*/
border-bottom: 1px solid #DDD;/*color of the lower border*/
color: #CCC; }

.header_info p, .header_info form p, .pager p {
margin: 0; padding: 2px 0;
font-size: 1.3em;
font-weight: bold; }

.header_info p.light, .pager p.light {
font-weight: normal; }

.header_info .hleft {
float: left;
text-align: left; }

.header_info .hright {
float: right;
text-align: right; }

.pager p { text-align: right; }


/* =layout_general
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- general layout style used throughout the entire template
*/


#header_wrapper, #footer_wrapper {
background: #FCFBF9; }

#header {
background: transparent url(http://www.animepaper.net:8080/images/verticaledge/ap_header.gif) no-repeat left bottom;/*this is the header of the userpage*/
height: 45px;/*height of the header image*/
border-bottom: 5px solid #EEE; }/*color of the border beloq the image*/

#header h1, #header h2 { display: none; }


#process_status {
position: fixed;
top: 0; left: 0;
text-align: center;
z-index: 99999; }
* html #process_status {
position: absolute; }

#process_status span {
background: #E60000;
padding: 5px 10px;
margin: 0;
font-size: 12px;
line-height: 20px;
color: white; }


#user_status {
background: #EEE;/*background color of the menu username/messages/paper*/
position: absolute;
top: -50px; right: 0;
display: block;
text-align: right;
font-size: 11px;
letter-spacing: 1px;
border: 1px solid #E0E0E0;/*border of the menu*/
padding: 5px; }

#user_status div { display: inline; }


#breadcrumb {
padding-top: 70px;
height: 20px; }

#breadcrumb p {
margin: 0; padding: 0;
font-size: 12px;
font-weight: bold;
line-height: 20px; }


#page_status {
margin-top: 1em;
text-align: center; }

#page_status span {
padding: 3px 10px;
margin: 0;
font-weight: bold;
color: #000; }

#page_status.normal span { background: #FAD163; }
#page_status.warning span { background: #FF8574; }


#content, #sidebar { margin-top: 0px; }


#sidebar { }

#sidebar img {
display: block;
margin: 0 auto;
text-align: center; }

#sidebar #shoutbox-div img,
#sidebar .list_img img { display: inline; }


#footer {
text-align: center;
border-top: 5px solid #EEE; }/*border color of the footer*/

#footer p {
margin: 0;
font-size: 10px;
color: #CCC; }/*font color in the footer*/


#write_form form {
background: #F4F4F4;/*bacground color of the writing form*/
border: 1px solid #DDD;/*border of that*/
padding: 5px; }

#write_form form .form_info {
background: #EEE;/*background color of the warning on the form*/
margin: 0 0 1em 0; padding: 5px;
border: 1px solid #DDD; }/*border of that*/

#write_form form .warning {
background: #FEC7C7;
margin: 0 0 1em 0; padding: 5px;
border: 1px solid #FF0000;
color: #FF0000; }

#write_form form #form_tool {
border: 1px solid #DDD;/*border color of the text options*/
padding: 4px;
}

#write_form form #bbcode_tool,
#write_form form #text_tool {
margin: 0;
padding: 0;
float: left; }

#write_form form #bbcode_tool li,
#write_form form #text_tool li {
position: relative;
float: left;
margin: 0 5px 0 0;
padding: 0;
list-style: none; }

#write_form form #text_tool ul {
display: none;
background: white;/*background color of the drop down menu*/
position: absolute;
top: 1em; left: -4px;
border: 1px solid #DDD; /*border of the border of the drop down menu*/
border-top: 3px solid #DDD;/*top border color*/
padding: 0; }
#write_form form #text_tool li:hover ul,
#write_form form #text_tool li.sfhover ul {
display: block; }
#write_form form #text_tool ul li {
margin: 0;
padding: 2px;
clear: left; }
#write_form form #text_tool ul li a {
display: block;
width: 100px;
margin: 0; padding: 4px;
background: none;
border: none; }
#write_form form #text_tool ul li a:hover {
background: #DDD; }/*color of the button on the drop down menu when hover*/

#write_form form #text_tool ul li.hugesize a,
#write_form form #text_tool ul li.largesize a,
#write_form form #text_tool ul li.mediumsize a {
line-height: 1em; }
#write_form form #text_tool ul li#text_color-red a {
color: red; }
#write_form form #text_tool ul li#text_color-green a {
color: green; }
#write_form form #text_tool ul li#text_color-blue a {
color: blue; }

/* Fix IE extra label padding to the right */
#write_form form label {
margin-left: 0;
margin-right: 0; }

#write_form form textarea {
width: 660px;
background-color: #;}/*background color of the writing form*/


#autocomplete_choices {
position:absolute;
top: -999; left: -999;
width:0px;
background-color: white;
border-top:1px solid #999;
border-bottom:1px solid #999;
margin:0px;
padding:0px;
z-index: 9999; }

#autocomplete_choices ul {
margin:0;
margin-top:0;
padding:0;
list-style-type: none; }

#autocomplete_choices li {
margin:0;
margin-bottom:0;
border-left:1px solid #999;
border-right:1px solid #999;
padding:2px 2px;
cursor:move;
font-size: 12px;
color: #555; }

#autocomplete_choices li.selected { background-color: #E0EACE; }


/* =layout_general_sidebar
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- general sidebar layout style used throughout the entire template
*/

#highlights { }

#highlights .highlights-meta {
background: #EEE;/*the color of the little boz below the highlighted wallpaper*/
margin-bottom: 0;
font-size: 10px;
font-weight: bold;
line-height: 2em;
text-align: center;
color: #666; }/*color of the font*/

#highlights .highlights-chooseby {
margin-top: 2px;
text-align: center;
font-size: 10px;
color: #CCC; }/*font color of the "Chosen by" text*/

#highlights .highlights-body {
overflow: hidden;
text-align: justify; }

#highlights .highlights-body img {
display: inline;
background: none;
border: 0; }

#highlights .link_box { font-size: 10px; text-align: center; }


#shoutbox-div { }

#shoutbox-div dl { font-size: 1.0em; }

#shoutbox-div dt {
padding-bottom: 2px;
margin-bottom: 2px;
border-bottom: 1px solid #DDDDDD; }/*color of the line that devided the posts in the shoutbox*/

#shoutbox-div dt:hover { border-bottom: 1px solid #8BBD17; }/*same line when hovered*/

#shoutbox-div dd {
margin: 0 5px;
margin-bottom: 1em; }

#shoutbox-div dd img {
display: inline;
background: none;
border: 0; }

#shoutbox-div ul {
margin: 0;
font-size: 10px;
list-style: none;
text-align: center; }

#shoutbox-div li {
display: inline;
margin: 0; }

#shoutbox-div form { text-align: center; }
#shoutbox-div input { display: inline; }


#myinfo { }

#myinfo .waller_rating , #myinfo .waller_rank, #myinfo .r_info {
background: #F4F4F4;/*color of the rating box*/
margin: 2px 0;
border: 1px solid #DDDDDD;/*color of the border*/
color: #888; }/*font color*/

#myinfo .waller_rating {
text-align: center;
font-size: 2.5em;
letter-spacing: 2px; }

#myinfo .waller_rank {
text-align: right;
font-size: 1.6em; }

#myinfo .waller_rank p {
margin: 2px 4px;
font-weight: bold; }

#myinfo .waller_rank p.rank {
float: left; }

#myinfo .waller_rank p.r_up, #myinfo .waller_rank p.r_dw {
float: right;
padding-left: 15px; }

#myinfo .waller_rank p.r_up {
background: transparent url(http://www.animepaper.net:8080/images/icons/rank_up.gif) no-repeat 0 60%;
color: green; }/*color of the arrow on the status bar when rising*/

#myinfo .waller_rank p.r_dw {
background: transparent url(http://www.animepaper.net:8080/images/icons/rank_down.gif) no-repeat 0 60%;
color: red; }/*color of the arrow when ranking down*/

#myinfo .waller_rank p.r_up span, #myinfo .waller_rank p.r_dw span {
display: none; }

#myinfo .r_info {
padding: 4px;
letter-spacing: 1px;
text-align: right; }

#myinfo .r_info strong {
float: left;
text-align: left; }



/* =layout_mode_regular
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- used on page that's on regular mode (most of the page)
*/

body.regular #content,
body.regular #sidebar { margin-top: 0px; }


/* =layout_mode_regular_gallery_showcase
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- gallery display showcase page
*/

#gallery_showcase { margin-bottom: 0; }

#gallery_showcase .first_col { width: 450px; }

#gallery_showcase .first_col .image_div {
margin: 0 auto;
text-align: center; }

#gallery_showcase .first_col h3 {
margin: 15px 0 -0.2em 0;
font-size: 1.8em;
font-weight: bold;
letter-spacing: 1px;
color: #AAA; }/*in the gallery this is the title color of the image (can be seen when clicking on a image*/

#gallery_showcase .first_col dl.showcase_info {
margin-top: 0;
margin-bottom: 4em;
border-top: 4px solid #DDD; }/*the border below the title*/

#gallery_showcase .first_col .post_box { margin-bottom: 0; }

#gallery_showcase .second_col { width: 220px; }

#gallery_showcase .second_col .image_div a span {
width: 100px;
margin-left: 110px; }

#gallery_showcase .second_col .generic_box p { text-align: left; }
#gallery_showcase .second_col .generic_box .body { margin-top: 1em; }
#gallery_showcase .second_col .option_box .body { margin-top: 0; }

/* For the sake of IE.. */
* html #gallery_showcase .first_col .post_box .body .inner { width: auto; }


/* =layout_mode_regular_gallery_statistic
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- gallery index page
*/

#ap_gallery_catstats_panels .second_col .generic_box .body { margin-top: 1em; }


/* =layout_mode_regular_gallery_category
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- gallery category page
*/

#ap_gallery_cats #indexes {
text-align: center;
margin-bottom: 2em;
font-size: 1.4em; }

#ap_gallery_cats .subsections p {
font-size: 1.2em; }


/* =layout_mode_regular_notification_frame
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- notification page
*/

#notification_frame {}

#notification_frame #quick_search {
margin-bottom: 0; }

#notification_frame table {
width: 100%;
border-collapse: collapse; }

#notification_frame table tr {
width: 100%; }

#notification_frame table tr.normal {
background: #E8EEFA;/*in your inbox this is the mail link background*/
font-size: 1.1em; }

#notification_frame table tr.unread {
background: transparent; }

#notification_frame table tr.unread a {
font-weight: bold;
color: #555; }

#notification_frame table tr.message {
background: #E4F8E7;
font-size: 1.1em; }

#notification_frame table tr.selected {
background: #FEF5DA;
font-size: 1.1em; }

#notification_frame table tr.normal:hover,
#notification_frame table tr.selected:hover {
background: #FEF5DA; }/*color of the message links when hover*/

#notification_frame table tr.normal a,
#notification_frame table tr.selected a {
display: block;
color: #888; }/*font color of the messages*/

#notification_frame table tr td {
padding: 5px;
border-top: 1px solid #DDD; }/*border between messages*/

#notification_frame thead tr td {
padding: 0;
border-top: 0; }

#notification_frame tfoot tr td {
padding: 0;
border-top: 0; }

#notification_frame table tr td.n_checkbox {
text-align: center;
width: 2%; }

#notification_frame table tr td.n_sender {
width: 15%; }

#notification_frame table tr td.n_status {
text-indent: -5000px;
width: 6%;
color: #888; }
html > body #notification_frame table tr td.n_status {
width: 2%; }
#notification_frame table tr.read td.n_status {
background: #E8EEFA url(http://www.animepaper.net:8080/images/icons/email_open.gif) no-repeat 50% 50%; }
#notification_frame table tr.unread td.n_status {
background: transparent url(http://www.animepaper.net:8080/images/icons/email.gif) no-repeat 50% 50%; }

#notification_frame table tr td.n_title {
width: 61%; }
html > body #notification_frame table tr td.n_title {
width: 65%; }

#notification_frame table tr td.n_time {
width: 16%; }

#notification_frame table tr td.n_msg {
width: 100%;
color: #888; }

#notification_frame table tr td.n_msg a {
display: inline; }

#notification_frame table tr td.n_msg span {
display: block;
color: #999; }

#notification_frame #notification_message {
padding: 1em 10px;
font-size: 1.1em;
line-height: 1.5em; }


/* =layout_mode_regular_userpage
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- userpage
*/

#ap_user_view #showcase { margin-bottom: 0; }

#ap_user_view #showcase .image_div {
margin: 0 auto;
text-align: center; }

#ap_user_view #showcase h3 {
margin: 15px 0 -0.2em 0;
font-size: 1.8em;
font-weight: bold;
letter-spacing: 1px;
color: #AAA; }

#ap_user_view #showcase dl.showcase_info {
margin-top: 0;
margin-bottom: 4em;
border-top: 4px solid #DDD; }/*color of the border below the avatar box*/

#ap_user_view #showcase .post_box {
margin-bottom: 2em; }

#ap_user_view #showcase_header .post_box .body p {
margin-top: 0;
margin-bottom: 0px;
font-size: 1.2em; }

#ap_user_view #showcase_header .post_box .body p.name {
margin-bottom: 5px;
font-weight: bold;
font-size: 1.6em; }


#ap_user_view #comments { padding-top: 2em; }


/* =layout_mode_showcase
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- page that's on showcase mode (gallery, main page)
*/

body.showcase #content,
body.showcase #sidebar { margin-top: 530px; }
body.showcase .image_div { margin-left: 5px; }


/* =layout_mode_showcase_main_showcase
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- Pages with those huge image showcase
*/

#main_showcase {
position: absolute;
top: 100px; left: 50%; margin-left: -440px;
display: block;
height: 500px;
width: 860px;
padding: 20px 0 0 20px;
z-index: 1; }

#main_showcase .image_div {
float: left;
margin: 0;
height: auto;
min-height: 0; }

#main_showcase .image_div span {
display: block;
position: relative;
width: 576px;
font-size: 1.7em;
font-weight: bold;
letter-spacing: 1px;
line-height: 2em;
color: #DDDDDD; }

#main_showcase .intro_div { margin-left: 590px; }

#main_showcase .intro_div h2 {
margin-top: 0;
margin-bottom: 10px;
font-size: 13px; }

#main_showcase .intro_div p {
margin-left: 0;
margin-right: 0;
font-size: 11px;
text-align: justify; }

#main_showcase .tiny_showcase {
display: block;
position: absolute;
top: 0; left:0;
z-index: 9000; }

#main_showcase .tiny_showcase .image_div {
float: none;
display: block;
margin: 0; margin-bottom: 5px; }



/* =layout_mode_download
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Used on:
-- download page duh..
*/

body.download { background-image: none; }

body.download #stretch {
margin: 0;
padding: 0;
width: 100%; }

body.download #container {
background-image: none;
margin: 0; width: 100%; }

body.download #content, body.download #sidebar {
margin: 0;
padding: 0; }

body.download .single-col { width: auto; }





/*
------------------------------------------------------------------------------
=extra
------------------------------------------------------------------------------*/

#serverstats {
background: #EEE;
position: absolute;
top: 30px;
left: 15%;
width: 70%;
margin: 5px 0;
padding: 5px;
color: #AAA;
border:3px solid #BBB;
z-index:12000;
display:none;
}



So there you have it i hope it helps

@Xenohawk: Now you dont have to hurry with the simple one ^^

EDIT: 10th Feb 2006
New code with the Xeno's CSS corrections. Now you can use bigger images without complications in the code coz of our awesome developers ^^

NOW THE FULL STYLE CUSTOMIZATION INSTRUCTIONS!

This post has been filtered for improved legibility #197274 Quote Report Edited by *Mrchak 2 years 4 months ago

user avatar
θsunsean
Retired Staff Member
Server Ninja
Topics: 8
Posts: 106
2 years 5 months ago
Thanks for the post. I'm sure that will help a lot of people get started.

user avatar
θxenohawk
Retired Staff Member
AP Stylist
Topics: 38
Posts: 231
2 years 5 months ago
Thanks Mrchak, this will be really helpful for a lot of people and for me XD.

EDIT: Nice work on the background for the group to the one that did it :)

#197515 Quote Report Edited by θxenohawk 2 years 5 months ago

user avatar
~akito85
Member
bishounen...
Topics: 11
Posts: 108
2 years 5 months ago
Yup thanks for sharing ^__^

user avatar
~yume-chan
Member
The Paper
Topics: 6
Posts: 50
2 years 5 months ago
Thank you so much! ^_^

user avatar
*Mrchak
Community Member
Orchestra the rhytm and the drum
Topics: 25
Posts: 338
2 years 4 months ago
OK i have changed the title of this thread to version 1.1 since there have been some changes for the code and i think i added instructions for the whole style but i am not sure @_@