amorphous | 3 layouts: Fruits Basket

3 Fruits Basket Layouts (Kyo/Tohru, Haru/Rin, and Hiro/Kisa)

Layout

Subject: Fruits Basket
Layout style: Smooth Sailing
Normal Sized Preview: Kyo/Tohru, Haru/Rin and Hiro/Kisa.
Image: Kyo/Tohru, Haru/Rin, and Hiro/Kisa.

No hotlinking! Put the header image on your own server, please!

CSS:
Kyo/Tohru

/* Cleaned CSS: */

/* PAGE */

body {
font-family: tahoma, sans-serif;
font-size: 7pt;
margin: 0px;
background-color: #ededed;
color: #000000;
margin-top: 20px;
margin-bottom: 20px;
}
a {
color: #D79495;
font-weight: lighter;
text-decoration: none;
}
a:visited {
color: #D79495;
font-weight: lighter;
text-decoration: none;
}
a:hover {
color: #000000;
font-weight: lighter;
text-decoration: none;
}

.pageblock{
width:699px;
margin: 0 auto;
background-color: white;
}
.pagefooterblock{
background-color: #ddd;
color: #000000;
padding: 4px 4px 4px 0px;
margin-top: 4px;
line-height: 40px;
text-align: center;
text-transform: uppercase;
}
.pagefooterblock a, .pagefooterblock a:visited {
color: #000000;
}

/* HEADER */

.pageheaderblock {
text-align: left;
background-image: url(http://i47.photobucket.com/albums/f186/south_of_nowhere/random%20entries/kyotohru.png);
width: 699px;
height: 555px;
}

.header-title {
display: none;
}
.header-subtitle {
display: none;
}
.header-icon {
top: 0px;
right: 0px;
position: absolute;
z-index: 1;

}
.header-menu {
padding: 0px 0px 0px 0px;
background-color: transparent;;
font-family: tahoma;
font-size: 9px;
line-height: 40px;
text-transform: uppercase;
text-align: center;
background-color: #ddd;

}
.header-menu a, .header-menu a:visited {
white-space: nowrap;
text-align: left;
padding: 2px 2px 2px 6px;
color: #D79495;
text-decoration: none;
}
.header-menu a:hover {
color: #000000;
}
.header-menu ul, #footer-menu ul {
margin: 0px;
padding: 0px;
}
.header-menu li, #footer-menu li {
display: inline;
}

/* BODY */

.bodyblock {
padding:0px;

}
.bodyheaderblock {
display: none;
}
.bodynavblock {
background-color: #fff;
color: #000000;
margin: 10px 0px 4px 0px;
padding: 9px;
}
.bodynavblock a, .bodynavblock a:visited {
color: #000000;
}
.body-title {
display: none;
}
.body-midtitle {
font-family: tahoma;
font-size: 18px;
color: #000000;
text-align: left;
padding-left: 8px;
}

/*ENTRIES*/
.entryHolder {
color: #000000;
background-color: white;
font-family: tahoma;
font-size: 10px;
margin: 4px 0px 4px 0px;
text-align: justify;
}
.entryUserinfo {
text-align: center;
margin: 5px 6px 3px 5px;

background-color: transparent;
}
.entryUserinfo-usericon img {
padding: 2px;
border: 1px solid #e0e0e0;
}
.entryText {
padding: 6px;
}
.entryHeader {
background-color: transparent;
color: #000000;
font-family: tahoma;
font-size: 10px;
padding: 4px 0px 4px 8px;
font-weight: normal;
text-transform: uppercase;

}
.entryHeader a{
color: #FFFFFF;
}
.entryHeaderSubject {
font-weight: normal;
display: block;
color: #D79495;
}
.entryHeaderDate a {
color : #D79495;
text-decoration : none;
}
.entryHeaderDate a:hover {
color : #000000;
text-decoration : underline;
}
.entryMetadata {
padding-left: 6px;
}
.entryMetadata ul {
margin: 0px;
padding: 0px;
}
.entryMetadata li {
list-style: none;
display: inline;
padding-right: 10px;
}
.entryMetadata-label {
font-weight: bold;
padding-right: 4px;
}
.entryLinkbar {
font-family: tahoma;
font-size: 11px;
color: #000000;
text-align: right;
padding: 4px 0px 4px 0px;
}
.entryLinkbar ul {
margin: 0px;
padding: 0px;
}
.entryLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
/*FOOTER*/

#footer-menu {
font-size: 11px;
}
#footer-menu a, .footer-menu a:visited {
color: #000000;
white-space: nowrap;
padding: 6px;
text-align: left;
}
/*SIDEBAR*/

.sidebar {
font-family: tahoma;
font-size: 7pt;
margin-right: 5px;
width: 170px;
border-left: 1px solid #ccc;
}
.sidebox {
color: #000000;
background-color: transparent;
margin: 4px 0px 4px 0px;

}
.sideboxTitle {
background-color: transparent;
border-bottom: 1px dotted #ccc;
color: #D79495;
font-family: tahoma;
font-size: 10px;
padding: 4px 0px 4px 0px;
text-align: left;
text-transform: uppercase;
margin-left: 15px;
}
.sideboxContent {
text-align: justify;
padding: 2px 4px 2px 4px;
}
.sidebox #profile, .sidebox #latestmonth, .sidebox #search {
text-align: center;
}
.sidebox #tags_sidebox {
text-align: center;
}
.sidebox #systemlinks {
text-align: center;
}
.sidebox #latestmonth table{
width: 90%;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
}
.listtitle {
font-weight: bold;
}
.profile-label {
font-weight: bold;
}
/*OTHER PAGES*/

/* COMMENT PAGE */

.commentHolder {
color: #000000;
background-color: #f8f8f8;
font-family: ;
font-size: 12px;
margin: 4px 0px 4px 0px;
}
.commentUserinfo {
text-align: center;
margin: 0px 8px 8px 0px;

background-color: #f8f8f8;
}
.commentUserinfo-usericon img {
border: 0;
}
.commentText {
padding: 6px;
}
.commentHeader {
background-color: #dddddd;
color: #000000;
font-family: ;
font-size: 12px;
padding: 4px 0px 4px 8px;
}
.commentHeader a{
color: #000000;
}
.commentHeaderScreened {
font-family: ;
font-size: 12px;
background-color: #cccccc;
padding: 4px 0px 4px 8px;
}
.commentHeaderSubject {
font-weight: bold;
}
.commentLinkbar {
font-family: ;
font-size: 11px;
color: #000000;
text-align: right;
padding-top: 4px;
padding-bottom: 4px;
}
.commentLinkbar ul {
margin: 0px;
padding: 0px;
}
.commentLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
.replyform {
background-color: #f8f8f8;
color: #000000;
padding-left: 10px;
}
#commenttext{
width:100%;
}
/*ARCHIVE PAGE*/
.yearlinks{
text-align: right;
}
.yearlink{
padding-left:4px;
padding-right: 4px;
}
.month {
width: 300px;
border: 1px solid #dddddd;
margin: 8px 8px 8px 40px;
}
.daysubjects {
color: #000000;
padding: 8px 8px 8px 40px;
}
.daytitles {
text-align: center;
border: 1px solid #dddddd;
background: #eeeeee;
color: #000000;
}
.day-blank {
border: 1px solid #dddddd;
}
.day {
border: 1px solid #dddddd;
}
.day-date {
border-right: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
color: #000000;
width: 50%;
text-align: center;
}
.day-count {
width: 50%;
text-align: center;
float: right;
font-size: 20px;
}
.day-count a {
text-decoration: none;
color: #000000;
}

/*TAGS PAGE*/

.tagstable, .tagstable td {
border: 1px solid #dddddd;
}
.tagstable { width: 300px; }

Haru/Rin

/* Cleaned CSS: */

/* PAGE */

body {
font-family: tahoma, sans-serif;
font-size: 7pt;
margin: 0px;
background-color: #ededed;
color: #000000;
margin-top: 20px;
margin-bottom: 20px;
}
a {
color: #8F7081;
font-weight: lighter;
text-decoration: none;
}
a:visited {
color: #8F7081;
font-weight: lighter;
text-decoration: none;
}
a:hover {
color: #000000;
font-weight: lighter;
text-decoration: none;
}

/* HEADER */

.pageheaderblock {
text-align: left;
background-image: url(http://i47.photobucket.com/albums/f186/south_of_nowhere/random%20entries/harurin.png);
width: 699px;
height: 555px;
}

.header-title {
display: none;
}
.header-subtitle {
display: none;
}
.header-icon {
top: 0px;
right: 0px;
position: absolute;
z-index: 1;

}
.header-menu a, .header-menu a:visited {
white-space: nowrap;
text-align: left;
padding: 2px 2px 2px 6px;
color: #8F7081;
text-decoration: none;
}
.header-menu a:hover {
color: #000000;
}
.header-menu ul, #footer-menu ul {
margin: 0px;
padding: 0px;
}
.header-menu li, #footer-menu li {
display: inline;
}

/* BODY */

.bodyblock {
padding:0px;

}
.entryHeader a{
color: #FFFFFF;
}
.entryHeaderSubject {
font-weight: normal;
display: block;
color: #8F7081;
}
.entryHeaderDate a {
color : #8F7081;
text-decoration : none;
}
.entryHeaderDate a:hover {
color : #000000;
text-decoration : underline;
}
.entryMetadata {
padding-left: 6px;
}
.entryMetadata ul {
margin: 0px;
padding: 0px;
}
.entryMetadata li {
list-style: none;
display: inline;
padding-right: 10px;
}
.entryMetadata-label {
font-weight: bold;
padding-right: 4px;
}
.entryLinkbar {
font-family: tahoma;
font-size: 11px;
color: #000000;
text-align: right;
padding: 4px 0px 4px 0px;
}
.entryLinkbar ul {
margin: 0px;
padding: 0px;
}
.entryLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
/*FOOTER*/

#footer-menu {
font-size: 11px;
}
#footer-menu a, .footer-menu a:visited {
color: #000000;
white-space: nowrap;
padding: 6px;
text-align: left;
}
/*SIDEBAR*/

.sidebar {
font-family: tahoma;
font-size: 7pt;
margin-right: 5px;
width: 170px;
border-left: 1px solid #ccc;
}
.sidebox {
color: #000000;
background-color: transparent;
margin: 4px 0px 4px 0px;

}
.sideboxTitle {
background-color: transparent;
border-bottom: 1px dotted #ccc;
color: #8F7081;
font-family: tahoma;
font-size: 10px;
padding: 4px 0px 4px 0px;
text-align: left;
text-transform: uppercase;
margin-left: 15px;
}
.sideboxContent {
text-align: justify;
padding: 2px 4px 2px 4px;
}
.sidebox #profile, .sidebox #latestmonth, .sidebox #search {
text-align: center;
}
.sidebox #tags_sidebox {
text-align: center;
}
.sidebox #systemlinks {
text-align: center;
}
.sidebox #latestmonth table{
width: 90%;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
}
.listtitle {
font-weight: bold;
}
.profile-label {
font-weight: bold;
}
/*OTHER PAGES*/

/* COMMENT PAGE */

.commentHolder {
color: #000000;
background-color: #f8f8f8;
font-family: ;
font-size: 12px;
margin: 4px 0px 4px 0px;
}
.commentUserinfo {
text-align: center;
margin: 0px 8px 8px 0px;

/*TAGS PAGE*/

.tagstable, .tagstable td {
border: 1px solid #dddddd;
}
.tagstable { width: 300px; }

Hiro/Kisa

/* Cleaned CSS: */

/* PAGE */

body {
font-family: tahoma, sans-serif;
font-size: 7pt;
margin: 0px;
background-color: #ededed;
color: #000000;
margin-top: 20px;
margin-bottom: 20px;
}
a {
color: #710406;
font-weight: lighter;
text-decoration: none;
}
a:visited {
color: #710406;
font-weight: lighter;
text-decoration: none;
}
a:hover {
color: #000000;
font-weight: lighter;
text-decoration: none;
}

/* HEADER */

.pageheaderblock {
text-align: left;
background-image: url(http://i47.photobucket.com/albums/f186/south_of_nowhere/random%20entries/hirokisa.png);
width: 699px;
height: 555px;
}

.header-title {
display: none;
}
.header-subtitle {
display: none;
}
.header-icon {
top: 0px;
right: 0px;
position: absolute;
z-index: 1;

}
.header-menu a, .header-menu a:visited {
white-space: nowrap;
text-align: left;
padding: 2px 2px 2px 6px;
color: #710406;
text-decoration: none;
}
.header-menu a:hover {
color: #000000;
}
.header-menu ul, #footer-menu ul {
margin: 0px;
padding: 0px;
}
.header-menu li, #footer-menu li {
display: inline;
}

/* BODY */

.bodyblock {
padding:0px;

}
.entryHeader a{
color: #FFFFFF;
}
.entryHeaderSubject {
font-weight: normal;
display: block;
color: #710406;
}
.entryHeaderDate a {
color : #710406;
text-decoration : none;
}
.entryHeaderDate a:hover {
color : #000000;
text-decoration : underline;
}
.entryMetadata {
padding-left: 6px;
}
.entryMetadata ul {
margin: 0px;
padding: 0px;
}
.entryMetadata li {
list-style: none;
display: inline;
padding-right: 10px;
}
.entryMetadata-label {
font-weight: bold;
padding-right: 4px;
}
.entryLinkbar {
font-family: tahoma;
font-size: 11px;
color: #000000;
text-align: right;
padding: 4px 0px 4px 0px;
}
.entryLinkbar ul {
margin: 0px;
padding: 0px;
}
.entryLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
/*FOOTER*/

#footer-menu {
font-size: 11px;
}
#footer-menu a, .footer-menu a:visited {
color: #000000;
white-space: nowrap;
padding: 6px;
text-align: left;
}
/*SIDEBAR*/

.sidebar {
font-family: tahoma;
font-size: 7pt;
margin-right: 5px;
width: 170px;
border-left: 1px solid #ccc;
}
.sidebox {
color: #000000;
background-color: transparent;
margin: 4px 0px 4px 0px;

}
.sideboxTitle {
background-color: transparent;
border-bottom: 1px dotted #ccc;
color: #710406;
font-family: tahoma;
font-size: 10px;
padding: 4px 0px 4px 0px;
text-align: left;
text-transform: uppercase;
margin-left: 15px;
}
.sideboxContent {
text-align: justify;
padding: 2px 4px 2px 4px;
}
.sidebox #profile, .sidebox #latestmonth, .sidebox #search {
text-align: center;
}
.sidebox #tags_sidebox {
text-align: center;
}
.sidebox #systemlinks {
text-align: center;
}
.sidebox #latestmonth table{
width: 90%;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
}
.listtitle {
font-weight: bold;
}
.profile-label {
font-weight: bold;
}
/*OTHER PAGES*/

/* COMMENT PAGE */

.commentHolder {
color: #000000;
background-color: #f8f8f8;
font-family: ;
font-size: 12px;
margin: 4px 0px 4px 0px;
}
.commentUserinfo {
text-align: center;
margin: 0px 8px 8px 0px;

/*TAGS PAGE*/

.tagstable, .tagstable td {
border: 1px solid #dddddd;
}
.tagstable { width: 300px; }

Flat | Top-Level Comments Only

Ahh! FB! These are AWESOME!!

*bows* Thank you Issa!

These are great... but no Shikito? :( *sniffles*

Sadly I couldn't find a good colored picture of Shigure/Akito which is my OTP of the series. I suck at coloring manga pics, too. :(

Guh!!! So sad. Well, at least you like them. :) These really are good. Well done! <3

Hey, if you can find a good pic of them, link it (off a website, not a colored image from someone on LJ, please) and I'll make a layout that matches these. *shrugs*

Thank you for the compliment!

Can you possibly make one of Saki/Tohru?

They're like my favorite OTP of the series.

I'll see if I can find a decent picture of them and see what happens. :)

As requested... Saki/Tohru (http://amorphous.livejournal.com/138692.html). Hopefully you like it! It was hard to find a picture of the two and ended up settling one that I had take Arisa out of. :)

Awwwww. Thank you so much. *^^*

If only I had a Saki/Tohru icon. :\

Edited 2008-03-12 17:48 (UTC)

Well, I don't like many of the artbook images of them, and rather than photoshop two together, I would prefer one of the more endearing images from the end of the series. But, it's Artemisia128's (http://artemisia128.livejournal.com/4536.html?thread=44984) manga image that she colored, so I understand if you don't want to use it. :) She is giving permission, though you would have to credit. I would color the manga myself, but I have no skill for photoshop.

I'll see what I can do. and I'll be sure, if I do, to credit her. Thanks for sharing!

I should be thanking you!!! <3 No problem!

Shigura/Akito (http://amorphous.livejournal.com/138692.html) with proper cred to

artemisia128.

These are wonderful! I don't know which one I want to use, but if I do, I'll credit!

3 layouts: Fruits Basket

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject