[layouts] KAT-TUN

Jan 26, 2009 20:43


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 !!

graphics: layout

Previous post Next post
Up