WONDER - [layouts] KAT-TUN

♀ JIN DRAGON ♀

aki-chan

♫ i love KAT-TUN

♫ my ichiban is Akanishi Jin

♫ i love friends so let's be friends now, ok?

thnx for viewing my page

CREDITS

milou_veronica for my layout stylesheet

other graphics are done by ME

Links

February 2009

Customize

Tags

Page Summary

Previous | Memories | Tell a Friend | Next

akirashock04

26 January 2009 @ 08:43 pm

[layouts] KAT-TUN

i've made a layout!! XD. Feauturing KAT-TUN ! I know i'm still not good, but comments are still appreciated, whether you're going to use it (which i doubt) or not. But for the preview.. here it is..

Copy and Paste this code to your CSS box.

For Live Preview

/* Stylesheet by presents.livejournal.com. */ body { background-color: #3C3C3C; text-align: center; color: #666666; font: 8pt arial, sans-serif; margin: 10px 0 20px 0; } a, a:link, a:visited, a:active { color: #1CBBB4; text-decoration: none; } a:hover { color: #F7941D; text-decoration: none; } strong, b { color: #1CBBB4; } em, i { color: #F7941D; } blockquote { margin: 0 8px 0 8px; padding: 8px; background-color: #fafafa; color: #808080; font: 7pt/15px arial, sans-serif; text-align: justify; } code, kbd, pre, tt { font-family: monospace; } textarea, .textbox, select, input { background-color: #fff; color: #9C9C9C; border: 1px solid #CCCACA; } select, input { border: 1px solid #CCCACA; } #content { width: 75%; margin: 0 auto; background-color: #fff; border: 0px; padding: 0px; } #maincontent { float: left; width: 75%; margin-top: 0px; background-color: transparent; color: #000000; border: 0px; text-align: left; } #sidebar { float: right; padding: 0 2px 0 4px; margin: 0 5px 0 0; background-color: transparent; border-left: 1px dotted #CCCCCC; text-align: left; width: 22%; } #header { padding: 0px; margin: 0px; text-align: left; font: normal 7pt arial, sans-serif; letter-spacing: 0px; background-color: #2C2C2C; color: #ffffff; } #footer { text-align: center; font: 7pt arial, sans-serif; background-color: transparent; color: #F7941D; z-index: 100; clear: both; border-top: 1px dotted #CCCCCC; padding: 10px 0 0 0; } div#footer a, div#footer a:link, div#footer a:visited { color: #1CBBB4; font-weight: normal; } div#footer a:hover { color: #F7941D; font-weight: normal; border-bottom: 1px dotted #ccc; } /* header */ div#header a, div#header a:link, div#header a:visited { color: #C1C1C1; 	} div#header a:hover { color: #FBEDFD; 	} .navheader { border: 0px; background-color: #1B1B1B; text-align: left; } ul.navheader { padding: 12px 0 12px 3px; margin: 0px; } ul.navheader li { display: inline; padding: 0 7px 0 7px; } ul.navheader li a { background-color: #1B1B1B; color: #ffffff; text-transform: uppercase; 	} .view { color: #ffffff; text-transform: uppercase; 	} .title {text-align: left; color: #1CBBB4; font: 12pt/15pt "trebuchet ms", arial, sans-serif; padding: 3px 10px 2px 10px; } .subtitle {text-align: right; color: #F7941D; font: 10pt/15pt "trebuchet ms", arial, sans-serif; padding: 1px 10px 3px 10px; } /* sidebar */ div#sidebar a, div#sidebar a:link, div#sidebar a:visited{ color: #F7941D; } div#sidebar a:hover { color: #808080; text-decoration: none; } .defaultuserpic { margin: 10px auto; background-color: #FAFAFA; padding: 5px; } .sbarheader { padding: 0px 5px 0px 5px; } .sbarbody { padding: 0px 5px 0px 5px; } .sbarbody2 { padding: 5px 5px 5px 8px; margin: 5px; 	color: #666; 	font: 9px/15px arial, sans-serif; background: #FAFAFA; } #sidebar_summary img {display: none;} .sbarcalendar { border: 1px solid #EFEFEF; text-align: center; font: 7pt arial, verdana, sans-serif; padding: 4px; color: #686868; } .sbarcalendarposts { border: 1px solid #98E0DC; text-align: center; font: 7pt arial, verdana, sans-serif; padding: 4px; } ul.sbarlist { padding-left: 0px; margin-left: 0px; list-style: none; } li.sbaritem, .tagcloud { padding-left: 3px; } li.sbaritem a, li.sbaritem a:link, li.sbaritem a:visited, li.sbaritem a:active { font-family: arial, sans-serif; font-size: 7pt; line-height: 24px; border: none; border-bottom: 1px dotted #CCCCCC; display: block; background: transparent url(http://img.photobucket.com/albums/v72/panthersgem/ref/oli-1.gif) no-repeat center left; padding: 0 0 0 13px; text-transform: lowercase; } li.sbaritem a:hover, a:hover visited, a:hover b { text-decoration: none; border-bottom: 1px dotted #CCCCCC; background: #FAFAFA url(http://img.photobucket.com/albums/v72/panthersgem/ref/oli-1.gif) no-repeat center left; } li.sbartitle { padding: 0; list-style: none; border: 0; background-color: #ffffff; margin: 18px 0 8px 0; color: #1CBBB4; font: 7pt arial, verdana, sans-serif; text-transform: uppercase; } span.count { display: none; } /* maincontent */ .entry { margin: 0 0 0 6px; padding: 0 10px 10px 10px; background-color: transparent; color: #6B6B6B; font: 8pt/16pt arial, tahoma, arial, sans-serif; text-align: justify; border-width: 0px; } .entry ul li { padding-left: 5px; margin-left: 15px; } .entry ol li { padding-left: 5px; margin-left: 15px; } .entry_text {padding: 0 0 12px 0;} .userpic { position: relative; float: left; margin: 10px 10px 3px 10px; background-color: #FAFAFA; padding: 5px; } .userpicfriends { background-color: #FAFAFA !important; padding: 5px; text-align: center; font-family: tahoma, arial, verdana, sans-serif; font-size: 7pt; margin: 10px 10px 3px 10px; position: relative; float: left; } .userpicfriends a font { font-family: arial, verdana, sans-serif; font-size: 7pt; color: #606060; } .userpicfriends a:hover font { color: #9C9C9C; } .date { color: #c0c0c0; font-family: tahoma, arial, verdana, sans-serif; font-size: 7pt; text-transform: lowercase; margin: 0 0 0 125px; padding: 6px 0 0 15px; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/time.gif) no-repeat bottom left; } .subject { color: #F7941D; font: 11pt "trebuchet ms", arial, georgia, verdana, sans-serif; padding: 5px 0 0 0; margin: 0; } .subject a, .subject a:link, .subject a:visited { color: #F7941D; } .subject a:hover { color: #FABC72; } .datesubject { background-color: #ffffff; padding: 5px; } .comments { font: 12pt "trebuchet ms", verdana, sans-serif; text-align: right; color: #F7941D; background-color: #ffffff; padding: 4px 10px 0px 5px; border-top: 1px dotted #ccc; text-transform: lowercase; margin: 10px 0 0 0; } div.comments a, div.comments a:link, div.comments a:visited{ color: #F7941D; } div.comments a:hover { color: #1CBBB4; text-decoration: none; border-bottom: 1px dotted #ccc; } .currentmood, .currentmusic, .currentlocation { text-transform: lowercase; color: #c0c0c0; font-size: 7pt; font-family: arial, sans-serif; line-height: 11pt; } .currentlocation { background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/oloc.gif) no-repeat center left; padding: 0 0 0 10px; } .currentmood { background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/omood.gif) no-repeat center left; padding: 0 0 0 11px; } .currentmusic { background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/omus.gif) no-repeat center left; padding: 0 0 0 11px; } .currents { padding: 0 0 3px 10px; margin: 0; } .currents a:link, .currents a:visited, .currents a:active { color: #A4A4A4; } .currents a:hover { color: #c0c0c0; border-bottom: 1px solid #EAEAEA; } .currents strong, .currentmood strong, .currentmusic strong { display: none; } .currentmood img {display: none;} .ljtags { margin: 12px 0 0 10px; font: 1pt arial, sans-serif; color: #fff; text-transform: lowercase; text-align: justify; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/otag.gif) no-repeat center left; padding: 3px 0 0 6px; } .ljtags a:link, .ljtags a:visited, .ljtags a:active { color: #A4A4A4; font-weight: normal; text-transform: lowercase; font-size: 7pt; padding: 0 6px 0 0; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/sep.gif) no-repeat center right; } .ljtags a:hover { color: #c0c0c0; border-bottom: 1px solid #EAEAEA; text-decoration: none; font-weight: normal; } /* maincontent -- entry, reply pages */ .datesubjectcomment { padding-top: 5px; line-height: 17pt; } .userpiccomment { background-color: #F7F7F7; padding: 5px; position: relative; left: 0px; margin: 10px; z-index: 15; float: left; top: -10px; } .box { border: 0px; padding: 10px; clear: left; background-color: #fff; color: #c6c6c6; } textarea.textbox { width: 95% !important; } .reply { position: relative; margin: 20px 30px 10px 30px; padding: 25px 10px 10px 10px; color: #9C9C9C; font: 8pt/18px arial, sans-serif; text-align: justify; background-color: #fff; } .commentreply { position: relative; margin: 10px; color: #9C9C9C; font: 8pt/18px arial, sans-serif; text-align: justify; padding: 5px; } .commentbox, .commenttext { padding: 5px; margin: 10px; background-color: #fff; border: 1px solid #CCCACA; } .commentboxpartial { padding: 10px; margin: 10px; background-color: #ffffff; border: 1px solid #efefef; color: #9C9C9C; font: 8pt/18px arial, sans-serif; text-align: justify; } .commentinfo { background-color: transparent; margin-top: 10px; width: 100%; } .replytoposter { text-align: right; color: #D1D1D1; text-transform: lowercase; font-size: 7pt; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/time2.gif) no-repeat center right; margin: 0 130px 0 0; padding: 8px 15px 0 0; line-height: 15pt; } .replytosubject { text-align: right; font-weight: normal; font-family: "lucida grande", arial, verdana, sans-serif; padding: 0 0 1px 0; color: #606060; font-size: 12pt; text-transform: lowercase; border-bottom: 1px solid #EFEFEF; margin: 0 130px 0 0; } /* maincontent -- year/achive pages */ /* year/achive pages */ ul.year { text-align: center; padding: 10px 0 10px 0; margin: 0 0 25px 0; background: #fff; color: #C6C6C6; } ul.year li { display: inline; } table.yeartable { margin: 0 auto; } table.yeartable td.yeardate, table.yeartable td.yearday { border: 1px solid #D0D0D0; background: #fff; } table.yeartable, td.yearday { background-color: transparent; text-align: center; color: #8A8A8A; background: #fff; padding: 10px; } td.yearmonth { border-style: none; background: #fff; } /* footer */ ul.navfooter{ padding: 0px; margin: 0px; } ul.navfooter li { display: inline; margin: 0 5px 0 5px; } .clearfoot { clear: both; } /* misc */ .clear { height: 0px; } .skiplinks { text-align: center; background: #fff; padding: 5px 0 0 0; } .separator{ height: 25px; } * html div.subcontent { /* fixes an IE reply page bug */ height: 1%; clear: none; } * html div.box#commentform { /* fixes an IE reply page bug */ position: absolute; border-width: 1px; border-style: solid; border-color: #999999; background-color: #c2cde0; } img[src="http://p-stat.livejournal.com/img/icon_protected.gif"]{ width: 0; height: 0; padding: 0 0 10px 7px; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/plock.gif); } img[src="http://p-stat.livejournal.com/img/icon_private.gif"]{ width: 0; height: 0; padding: 0 0 10px 7px; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/plock.gif); } .ljuser img { width: 0; height: 0; background-repeat: no-repeat; background-color: transparent; background-image: url(http://img.photobucket.com/albums/v72/panthersgem/ref/ti1.gif); padding: 14px 7px 2px 2px !important; } .ljuser a:hover b { color: #93DFDC; background: transparent; } .ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] { 	background-color: transparent; 	background-image: url(http://img.photobucket.com/albums/v72/panthersgem/ref/ti1.gif); padding: 14px 7px 2px 2px !important; 	} .ljuser:hover img[src="http://p-stat.livejournal.com/img/userinfo.gif"] { 	background-image: url(http://img.photobucket.com/albums/v72/panthersgem/ref/ti2.gif); 	} .ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] { background-color: transparent; 	background-image: url(http://img.photobucket.com/albums/v72/panthersgem/ref/ti1.gif); padding: 14px 7px 2px 2px !important; 	} .ljuser:hover img[src="http://p-stat.livejournal.com/img/community.gif"] {background-image: url(http://img.photobucket.com/albums/v72/panthersgem/ref/ti2.gif); 	} #ljuser_row img[src="http://p-stat.livejournal.com/img/userinfo.gif"]{ width: 0; height: 0; padding: 0 7px 10px 0; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/ti1.gif); } .ljcmt, .commentbox img[src="http://p-stat.livejournal.com/img/btn_del.gif"]{ width:0; height:0; padding: 0 16px 14px 0; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/cup_delete.png); } .ljcmt, .commentbox img[src="http://p-stat.livejournal.com/img/btn_scr.gif"]{ width:0; height: 0; padding: 0 16px 14px 0; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/cup_screen.png); } .ljcmt, .commentbox img[src="http://p-stat.livejournal.com/img/btn_freeze.gif"]{ width: 0; height: 0; padding: 0 16px 14px 0; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/cup_freeze.png); } .ljcmt, .commentbox img[src="http://p-stat.livejournal.com/img/btn_edit.gif"]{ width: 0; height: 0; padding: 0 16px 14px 0; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/cup_edit.png); } .ljcmt, .commentbox img[src="http://p-stat.livejournal.com/img/btn_track.gif"]{ width: 0; height: 0; padding: 0 16px 14px 0; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/cup_track.png); } .box img[src="http://p-stat.livejournal.com/img/anonymous.gif"]{ width: 0; height: 0; padding: 0 16px 12px 0; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/box_anon.png); } .box img[src="http://p-stat.livejournal.com/img/openid-profile.gif"]{ width: 0; height: 0; padding: 0 16px 15px 0; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/box_oi.png); } .box img[src="http://p-stat.livejournal.com/img/help.gif"]{ width: 0; height: 0; padding: 0 14px 14px 0; background: url(http://img.photobucket.com/albums/v72/panthersgem/ref/box_help.png); } .headerimage { position: relative; margin: 0 auto 0 auto; width: 740px; height: 500px; background-repeat: no-repeat; background-image: url(http://i43.tinypic.com/jubcw3.jpg); }

Original Stylesheet by:

refuted

>> Comment
>> Credit
>> Do not Edit !!
>> Enjoy !!

</lj>

Tags: graphics: layout

15 comments | comment

( 15 comments — Post a new comment )

hac_hong_huong on January 26th, 2009 01:20 pm (UTC)

Oi I like it
:D

(Reply) (Thread) (Link)

stephichan1 on January 26th, 2009 03:42 pm (UTC)

Cute!
One of my fave group pics of them!
The only thing I'd recommend is making the edges of the header flush (even) with the edge of the blog body.
Other than that, good job!

(Reply) (Thread) (Link)

ahumbuggy on January 26th, 2009 04:19 pm (UTC)

OOOOOH~ pretty!

(Reply) (Thread) (Link)

sammi561104 on January 26th, 2009 04:21 pm (UTC)

thank you!:D loved it!<3

(Reply) (Thread) (Link)

sammi561104 on January 26th, 2009 04:25 pm (UTC)

i like it, but i can't seem to get Lj to display it on my journal :S
Is there some settings i have to change?(sorry i'm a total noob when it comes to Lj layouts)

(Reply) (Thread) (Link)

akirashock04 on January 28th, 2009 12:52 pm (UTC)

ah maybe the reason you can't apply it is the theme.. is your journal theme set on "flexible squares?" lol. this is my fault.. i didn't put some steps.. don't worry next time, i'll put osme intructions. :)

if there's still something wrong, tell me.. :P

(Reply) (Parent) (Thread) (Link)

kattunfanboy on January 26th, 2009 05:33 pm (UTC)

I really like this layout! Keep the good work! ^__^

(Reply) (Thread) (Link)

akillarian on January 27th, 2009 05:58 am (UTC)

That image is actually on my desktop and is my favourite KAT-TUN group picture :)

Nice job. It look good.

(Reply) (Thread) (Link)

zuya_yuna on January 28th, 2009 05:42 am (UTC)

oh my..this is so CUTE!!
thanks for sharing..^^

(Reply) (Thread) (Link)

gachapin18 on January 28th, 2009 12:45 pm (UTC)

yay! so nice! taking :) thank you!

(Reply) (Thread) (Link)

syri_chii on January 29th, 2009 01:25 am (UTC)
thank you

hi.. I'm aya..
cool lay-out..^________^
I hope you don't mind taking it..
thanks for sharing..

(Reply) (Thread) (Link)

lalesca on February 5th, 2009 02:51 pm (UTC)

I love it and I hope your don't mid that I use it in a LJ that I'm going to do for projects of our subbing team of videos from KAT-TUN, but into Portuguese language. :D
If there's a problem if I may or not use it, plz tell and I won't use it!
Thanks in advance!

(Reply) (Thread) (Link)

akirashock04 on February 6th, 2009 10:53 am (UTC)

i don't mind at all! :) just credit me and tell me the name of the comm.. ahaha. because i'm interested in it too. :)

(Reply) (Parent) (Thread) (Link)