Layout Post #10!

Oct 13, 2008 00:31

KODA KUMI IN PRETTY BLUE!
The first layout I ever made from a request, hope you like it, ayumi_hino!





TITLE : KODA KUMI - PICTURE PERFECT
STYLE : S2
TYPE : FLEXIBLE SQUARES
WORKS ON : FREE, PAID, SPONSORED


Click here to see a screenshot of the layout!

LAYOUT CODE

BODY {
margin-top: 0px;
background-color:#71dfe6;
background-image: url('');
background-repeat: repeat;
background-position: top-left;
background-attachment: fixed;
text-align: center;
font-size: 11px;
color: #d9e4f7;
font-family: "Trebuchet MS", sans-serif;
}

a, a:link, a:visited {
text-decoration: none;
color: #71dfe6;
padding: 0px;
}

a:hover {
text-decoration: line-through;
color: #71dfe6;
background:;
padding: 0px;
}

code, kbd, pre, tt {
font-family: ariel;
}

p, td, blockquote {
font-size: 11px;
background-color: #d9e4f7;
}

#content {
width: 750px;
margin-left: auto;
margin-right: auto;
border-top: solid 0px #71dfe6;
background-color: #fffffe;
background-repeat: repeat;
padding: 0px;
text-align: justify;
border-style: solid;
border-color:#71dfe6;
border-width: 0px;
}

#maincontent {
padding: 5px;
margin-top: 10px;
font-family: "arial", sans-serif;
font-size: 11px;
line-height: 15px;
background-color: #fffffe;
background-repeat: repeat;
color:#d9e4f7;
border-style: dashed;
border-color:#e6c4a3;
border-width: 0px;
margin-right: 0px;
margin-left: 200px;
text-align: justify;
}

#header {
width: auto;
padding-top: 3px;
padding-bottom: 3px;
line-height: 30px;
background-color: # fffffe;
background-repeat: no-repeat;
width: 750px; height: 30px
background-position: center;
font-family: "Trebuchet Ms", sans-serif;
font-size: 9px;
font-weight: normal;
text-transform: uppercase;
color: #888888;
text-align: center;
letter-spacing: 1px;
border-width: 0px;
}

#footer {
width: auto;
padding-top: 0px;
padding-bottom: 0px;
line-height: 60px;
background-color: ;
background-repeat: no-repeat;
width: 750px; height: 30px
background-position: center;
font-family: "Trebuchet Ms", sans-serif;
font-size: 9px;
font-weight: normal;
text-transform: uppercase;
color: #888888;
text-align: center;
letter-spacing: 1px;
border-width: 0px;
}

#sidebar {
padding: 10px;
margin-top: 10px;
background-color: #fffffe;
background-repeat: repeat;
border-width: 0px;
font-size: 10px;
line-height: 11pt;
font-family: "arial", sans-serif;
color: #71dfe6;
width: 150px;
float: left;
text-align: justify;
}

/* header -- links to views; title of journal; subtitle of journal */
div#header a, div#header a:link, div#header a:visited, div#header a:active {
padding: 3px;
font-size: 9px;
font-weight: normal;
text-transform: uppercase;
color: #71dfe6;
text-align: center;
letter-spacing: 1px;
background-color: ;
}

div#header a:hover {
padding:3px;
color: #777777;
background-color: ;
border-bottom: 0px dashed;
}

div#footer a, div#footer a:link, div#footer a:visited, div#footer a:active {
padding: 3px;
font-size: 9px;
font-weight: normal;
text-transform: uppercase;
color: #71dfe6;
text-align: center;
letter-spacing: 1px;
background-color: ;
}

div#footer a:hover {
padding:3px;
color: #777777;
background-color: ;
border-bottom: 0px dashed;
}

ul.navheader {
padding: 5px;
margin: 5px;
}

ul.navheader li {
display: inline;
padding: 5 3px 5 3px;
}

.title {
display: none;
text-align: center;
color: #fffffe;
font-family: "Trebuchet MS", sans-serif;
font-size: 0px;
letter-spacing: 0pt;
text-transform: uppercase;
}

.subtitle {
display: none;
text-align: center;
color: #FEFEFE;
font-family: "Trebuchet MS", sans-serif;
font-size: 0px;
letter-spacing: 0pt;
line-height: 0pt;
text-transform: lowercase;
}

/* footer */

ul.navfooter {
padding: 10px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 0px 0 0px;
}
.clearfoot {
display: none;
clear: both;
}

/* sidebar */
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #71dfe6;
text-decoration: none;
background-repeat: repeat;
background-color:;
}

div#sidebar a:hover {
color:#71dfe6;
text-decoration: line-through;
background-repeat: repeat;
background-color:;
}

.defaultuserpic {
text-align: left;
padding: 6px;
z-index: 0;
background-color: #fffffe;
background-repeat: no-repeat;
border-width: 0px;
border-color: #71dfe6;
border-style: dashed;
}

.sbarheader {
padding: 0px 5px 0px 5px;
color: #fffffe;
text-align: center;
}

.sbarbody {
padding: 0 0px 0 0px;
}

.sbarbody2 {
padding: 0 0px 0 0px;
}

table.calendar {
margin-right: auto;
margin-left: auto;
}

.sbarcalendar {
border-width: 0px;
border-style: dashed;
border-color: #e6c4a3;
font-family: "arial", sans-serif;
font-size: 10px;
text-align: center;
}

.sbarcalendarposts {
background-color:#71dfe6;
text-align: center;
font-family: "Arial", sans-serif;
font-size: 10px;
border-width: 1px;
border-color: #570112;
}

ul.sbarlist {
margin-left: 2px;
list-style: none;
padding-left: 0px;
}

li.sbaritem {
margin: 5px 2px 2px 2px;
padding: 2px 2px 2px 7px;
list-style: none;
background-color: #fffffe;
background-repeat: repeat;
border-bottom: 0px dashed #e6c4a3;
}

li.sbaritem:hover {
background-color: #fffffe;
background-image: url(' ');
background-repeat: repeat;
}

li.sbartitle {
padding-left: 0px;
padding-right: 0px;
text-align:left;
padding: 5px;
list-style: none;
margin-bottom: 1px;
margin-top: 0px;
color:#71dfe6;
border-bottom: dashed 5px #71dfe6;
font-weight: none;
font-family: "arial", sans-serif;
text-transform: uppercase;
font-size: 12px;
background-color: #fffffe;
background-repeat: repeat;
letter-spacing: 2pt;
}

/* maincontent -- entry, reply pages */
.subcontent {
background-color: #fffffe;
background-repeat: repeat;
}

.entry {
margin: 10px 150px 10px 10px;
padding: 5px 10px 10px 10px;
background-color: #fffffe;
background-repeat: repeat;
color: #888888;
font-weight: lighter;
font-family: "Lucida Sans Unicode", sans-serif;
font-size: 11px;
text-align: justify;
border-width: 0px;
border-color: #71dfe6;
border-style: solid;
}

.entry ul li {
padding-left: 5px;
margin-left: 15px;
}

.entry ol li {
padding-left: 5px;
margin-left: 15px;
}

.userpic {
position: relative;
float: right;
padding: 6px;
margin-right: 5px;
margin-left: 5px;
z-index: 15;
background-repeat: no-repeat;
border-width: 0px;
border-color: #888888;
border-style: dashed;
}

.userpicfriends {
position: relative;
float: right;
margin: 5px;
padding: 6px;
text-align: center;
font-family: "arial", sans-serif;
font-size: 9px;
font-color: #888888;
z-index: 15;
border-style: dashed;
border-width: 0px;
border-color: #888888;
background-color: #888888 !important;
background-repeat: no-repeat;
}

.date {
line-height: 200%;
top: 3px;
font-family: "arial", sans-serif;
font-size: 9px;
color: #888888;
text-align: left;
letter-spacing: 1px;
font-weight: none;
text-transform:lowercase;
background-color: #fffffe;
}

.subject {
padding: 2px;
font-weight: light;
font-size: 11px;
color:#71dfe6;
font-family: "arial", sans-serif;
text-align: left;
border-bottom: 2px #71dfe6 dashed;
text-transform:uppercase;
background-color: #fffffe;
background-repeat: repeat;
letter-spacing: 1pt;
}

.subject a, .subject a:link, .subject a:visited {
color: #71dfe6;
}

.subject a:hover {
color: #d9e4f7;
}

::-moz-selection {
background: #D9E4F7;
color: #888888;
}

blockquote {
margin: 15px 15px 15px 15px;
text-align: justify;
color: #888888;
font-family: "Lucida Sans Unicode", sans-serif;
font-size: 10px;
border: 1px #71dfe6 dashed;
padding: 10px;
}

textarea {
margin: 15px 15px 15px 15px;
text-align: justify;
color: #888888;
font-family: "Lucida Sans Unicode", sans-serif;
font-size: 10px;
border: 1px #71dfe6 dashed;
padding: 10px;
}

.datesubject {
background-color: #fffffe;
background-repeat: repeat;
padding: 2px;
}

.currents, .currentmood, .currentmusic {
font-family: "arial", sans-serif;
font-size: 10px;
color: #71dfe6;
}

.comments {
font-family: "arial", sans-serif;
font-size: 14px;
text-align: right;
font-weight: none;
padding: 10px;
position: relative;
top: 10px;
border-top: dashed 5px #71dfe6;
background-color: #fffffe;
background-repeat: repeat;
text-transform:uppercase;
letter-spacing: 2pt;
}

/* for formatting separators between entries */
.separator {
background: #fffffe;
height: 25px;
}

div.comments a, div.comments a:link, div.comments a:visited{
color: #71dfe6;
font-size: 14px;
padding: 2px;
font-weight: lighter;
}

div.comments a:hover {
font-size: 14px;
font-weight: lighter;
color: #d9e4f7;
background: ;
padding: 2px;
}

.ljtags {
font-family: "arial", sans-serif;
font-size: 10px;
color: #d9e4f7;
margin-top: 15px;
font-weight: none;
text-transform: lowercase;
position: left;
}

.headerimage {
position: relative;
width: 850px; height: 550px;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
background-image: url('http://i34.tinypic.com/2illua0.png');
background-repeat: no-repeat;
}

.datesubjectcomment {
background-color: #fffffe;
background-image: url(' ');
background-repeat: repeat;
padding: 5px;
margin-top: 20px;
}

.userpiccomment {
position: relative;
border-width: 1px;
border-style: solid;
border-color: #BED870;
background-color: #BED870;
top: -30px;
left: 0px;
padding: 5px;
margin: 10px 10px -20px 10px;
z-index: 15;
float: left;
border-width: 1px;
border-color: #919bad;
border-style: solid;
}

.box {
border-style: dotted;
border-width: 0px;
border-color: #71dfe6;
padding: 8px;
clear: left;
}

input, textarea {
background-color: 71dfe6;
color: #d9e4f7;
}

textarea.textbox {
width: 100% !important;
}

.reply {
position: relative;
margin: 10px 5px 5px 30px;
padding: 15px 5px 5px 5px;
text-align: left;
font-family: "arial", sans-serif;
font-size: 11px;
line-height: 100%;
background-color: #fffffe;
background-repeat: repeat;
color: #d9e4f7;
}

.replytosubject {
font-weight: none;
}

.commentreply {
position: relative;
margin: 10px;
font-size: 11px;
font-family: "arial", sans-serif;
color: #71dfe6;
}

.commentbox {

border-color: #BED870;
border-width: 0px;
border-style: dotted;
padding: 10px;
margin: 10px;
background-color: #fffffe;
background-image: url(' ');
background-repeat: repeat;
}

.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: ##58b1ec;
}

.datesubjectcomment a:hover {
color: #888888;
}

.commentboxpartial {
border-color: #71dfe6;
border-width: 1px;
border-style: solid;
padding: 9px;
margin: 9px;
background-color: #BED870;
}

.commentinfo {
background-color: #fffffe;
background-repeat: repeat;
margin-top: 12px;
width: 100%;
}

/*
MAKER : KOMOREBII @ LJ
*/

The images are already hosted up on tinypic.com, but I recommend you to save them on your own server instead.

Link to the header

RULES
1. Please do credit (:! Making layouts and coding takes a lot of work!
There is no watermark on the headers or anywhere else in the layout. Please add credit on your profile ♥

2. Please do comments! I love suggestions and honest critique, what could have been better?'

3. Please do not redistribute on other pages or communities!

4. You're of course allowed to change the colors of links etc & layout header, but I'd still like credit :D

HOW TO USE THE LAYOUT
- First of all, make sure your layout is "S2" and "FLEXIBLE SQUARES".
You can activate that here!

- Paste the code you want into your Customize-Box, which is here.

- And make sure all the boxes are checked on NO, then press "Save Changes"!

- When it comes to what you want in your sidebar, you pick that by going to the sidebar page(which should be a link on the left side, but if you can't find it, the link is here., then pick what you want on your sidebar, remember to press "save changes"!

Got any questions or need help? Feel free to ask :] !
Like what you see? Please do watch Komorebii~~ ♥

* user: arwenchan, music artist: koda kumi, other: layout

Previous post Next post
Up