[Layout; Aiba Masaki] #1 - アオゾラ (Aozora)

[saturn_necklace]

Here's an Aiba layout just in time for the new year. The lyrics on the header come from the song アオゾラペダル (Aozora pedal), hence the name of the layout. I haven't made any layouts in a while, since I've been fairly busy with school and stuff, and since I have exams soon, I don't know when I'll next make another one. If I find time before Sho's birthday (25th January) it'll most likely be a Sho layout that I make next, if not then I'm not sure.

Anyway, happy new year, everyone!

Layout preview:


To use this layout:

1. Go to "customize journal" and select the "Black and White and Red All Over" flexible squares layout as your current theme
2. Click "customize your theme" then go to the section which says "custom css"
3. Make sure "Use layout's stylesheet(s)" and "Use layout's stylesheet(s) when including custom external stylesheet" are both set to No (IMPORTANT)
4. Paste the following code into the box which says "Custom stylesheet"

/* Cleaned CSS: */

body {
background-color: #5ebfdd;
background-image: url(http://i154.photobucket.com/albums/s275/saturn_necklace/GreyStripes.png);
background-attachment: fixed;
text-align: center;
color: #c0c0c0;
font-family: "Verdana", sans-serif;
font-size: 11px;
margin: 0px 0 0px 0;
}

a, a:link, a:visited {
color: #5ebfdd;
font-weight: normal;
text-decoration: none;
font-family: arial, helvetica, sans-serif;}

a:hover {
color: #5ebfdd;
text-decoration: none;
font-weight: normal;
font-family: arial, helvetica, sans-serif;
border-width: 0px 0px 1px 0px;
border-style: dotted;
border-color: #c0c0c0}

p, td, blockquote {
font-size: 11px;
}

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

#content
{
width: 841px;
margin-left: auto; margin-right: auto;
background-color: #ffffff;
border-width: 0px 0px 0px 0px;
border-style: dotted;
border-color: #c0c0c0;
padding: 0px;
}

#maincontent {
margin-top: 15px;
font-family: "Verdana", sans-serif;
font-size: 11px;
background-color: #ffffff;
color: #c0c0c0;
border-style: solid;
border-color: #5ebfdd;
border-width: 0px;
margin-left: 180px;
text-align: left;
}

#sidebar {

padding-top: 15px;
margin-top: 15px;
background-color: #ffffff;
border-color: #c0c0c0;
border-width: 0px 1px 0px 0px;
border-style: dotted;
font-size: 8px;
font-family: "Verdana", sans-serif;
color: #c0c0c0;
text-transform: uppercase;
width: 160px;
float: left;
text-align: left;
}

#header {
padding: 0px 0px 20px 0px;
margin: 0px;
text-align: center;
font-family: "Verdana", sans-serif;
text-transform: uppercase;
font-size: 15px;
font-weight: bold;
letter-spacing: 1px;
border-style: solid;
border-color: #5ebfdd;
border-width: 0px;
background-color: #ffffff;
color: #a8a8a8;
}

#footer {
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: bold;
letter-spacing: 1px;
background-color: #ffffff;
color: #c0c0c0;
border-color: #5ebfdd;
border-width: 0px;
border-style: solid;
z-index: 100;
clear: both;
}

/* header -- links to views; title of journal; subtitle of journal */

div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
color: #5ebfdd;
}

div#header a:hover, div#footer a:hover {
color: #5ebfdd;
font-weight: bold;
}

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

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

.title {
display: none;
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: normal;
line-height: 200%;
top: 10px;
}

.subtitle{
display: none;
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: normal;
top: 10px;
}

/* sidebar */

div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #c0c0c0;
}

div#sidebar a:hover {
color: #c0c0c0;
text-decoration: none;
}

.defaultuserpic {
text-align: center;
}

.sbarheader {
padding: 0px 5px 0px 5px;
}

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

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

#sidebar_summary li.sbaritem {
margin: 0 10px;
padding: 3px 0;
border-bottom: 1px #5ebfdd solid;
text-transform: uppercase;
}

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

.sbarcalendar {
border-color: #c0c0c0;
border-width: 0px;
border-style: solid;
text-align: center;
font-family: "Verdana", sans-serif;
text-transform: uppercase;
font-size: 11px;
}

.sbarcalendarposts {
border-color: #c0c0c0;
border-width: 0px;
border-style: solid;
background-color: #ffffff;
text-align: center;
font-family: "Verdana", sans-serif;
text-transform: uppercase;
font-size: 11px;
}

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

li.sbaritem, .tagcloud
{
padding-left: 15px;
list-style: none;
}

li.sbartitle
{
padding-left: 15px;
list-style: none;
border-style: solid;
border-width: 0px;
border-color: #5ebfdd;
background-color: transparent;
margin-bottom: 10px;
margin-top: 10px;
}

/* maincontent */

.subcontent {
}

.entry {
margin: 0px 10px 10px 30px;
padding: 10px;
background-color: #ffffff;
color: #c0c0c0;
font-family: "Verdana", sans-serif;
font-size: 11px;
text-align: left;
border-width: 0px;
border-color: #c0c0c0;
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: left;
background-color: transparent;
padding: 5px;
margin: 10px;
z-index: 15;
border-width: 0px;
border-color: #c0c0c0;
border-style: solid;
}

.userpicfriends {
position: relative;
float: left;
padding: 5px;
margin: 10px;
text-align: center;
border-style: solid;
border-width: 0px;
border-color: #c0c0c0;
font-family: "Verdana", sans-serif;
font-size: 11px;
z-index: 15;
}

.date {
line-height: 200%;
top: 5px;
color: #c0c0c0;
font-family: "Verdana", sans-serif;
text-transform: uppercase;
font-size: 11px;
}

.subject {
font-weight: bold;
padding: 10px;
color: #c0c0c0;
font-family: "Verdana", sans-serif;
text-transform: uppercase;
font-size: 11px;
}

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

.subject a:hover {
color: #5ebfdd;
}

.datesubject {
background-color: #transparent;
padding: 5px;
}

.currents, .currentmood, .currentmusic {
font-family: "Verdana", sans-serif;
font-size: 11px;
}

.comments {
font-family: "Verdana", sans-serif;
font-size: 11px;
text-align: right;
background-color: #transparent;
padding: 0px 5px 0px 5px;
position: relative;
top: 15px;
}

div.comments a, div.comments a:link, div.comments a:visited{
color: #c0c0c0;
}

div.comments a:hover {
color: #5ebfdd;
text-decoration: none;
}

/* maincontent -- entry, reply pages */

.datesubjectcomment {
background-color: transparent;
padding: 5px;
margin-top: 20px;
}

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

.box {
border-style: solid;
border-width: 1px 0px 0px 0px;
border-color: #c0c0c0;
border-style: dotted;
background-color: transparent;
padding: 10px;
clear: right;
}

input, textarea {
background-color: #ffffff;
color: #c0c0c0;
}

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

.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: "Verdana", sans-serif;
font-size: 11px;
line-height: 125%;
background-color: #ffffff;
color: #c0c0c0;
}

.replytosubject {
font-weight: normal;
}

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

.commentbox {

border-color: #5ebfdd;
border-width: 0px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: #ffffff;
}

.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #5ebfdd;
}

.datesubjectcomment a:hover {
color: #5ebfdd;
}

.commentboxpartial {
border-color: #5ebfdd;
border-width: 0px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: #ffffff;
}

.commentinfo {
background-color: #ffffff;
margin-top: 10px;
width: 100%;
}

/* maincontent -- year/achive pages */

ul.year {
text-align: center;
padding-bottom: 40px;
}

ul.year li {
display: inline;
}

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

table.yeartable td.yeardate, table.yeartable td.yearday {
border-width: 0px;
border-style: solid;
border-color: #5ebfdd;
}

table.yeartable td.yearday {
background-color: #ffffff;
text-align: center;
}

td.yearmonth {
border-style: none;
}

/* footer */

ul.navfooter{
padding: 0px;
margin: 0px;
}

ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}

.clearfoot {
clear: both;
}

/* misc */

.clear {
height: 15px;
}

.skiplinks {
text-align: center;
}

.headerimage {
/* for formatting header image */
position: relative;
margin-left: auto;
margin-right: auto;
width: 841px;
height: 531px;
background-image: url('http://i154.photobucket.com/albums/s275/saturn_necklace/Aibaaozoraheader-1.png');
}

.separator{
/* for formatting separators between entries */
height: 35px;
}

* 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: 0px;
border-style: solid;
border-color: #5ebfdd;
background-color: #ffffff;
}

');
}

.separator{
/* for formatting separators between entries */
height: 35px;
}

* 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: 0px;
border-style: solid;
border-color: #5ebfdd;
background-color: #ffffff;
}

/* --- TINY ICONS --- */
.ljuser img {
width: 0; height: 0;
background-repeat: no-repeat; background-color: transparent;
background-image: url(http://i154.photobucket.com/albums/s275/saturn_necklace/user_icon_cyan.gif);
padding: 12px 8px 0 2px !important;
}

/* --- User icons --- */
.ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] {
background-color: transparent;
background-image: url(http://i154.photobucket.com/albums/s275/saturn_necklace/user_icon_cyan.gif);
padding: 12px 8px 0 2px !important;
}

/* --- Community icons --- */
.ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] {
background-color: transparent;
background-image: url(http://i154.photobucket.com/albums/s275/saturn_necklace/com_icon_cyan.gif);
padding: 14px 14px 0 2px !important;
}

/* --- Lock icons --- */
img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] {
width: 0; height: 0;
padding: 11px 9px 0px 0px !important;
background-image: url(http://i154.photobucket.com/albums/s275/saturn_necklace/lock_gray5.gif);
background-repeat: no-repeat;
}

5. Click "save changes"

Please note:
-Credit is necessary, just paste this: Layout from in your profile.
-Comments are appreciated
-I will try to answer any questions, but I am quite busy, and may not be able to
-Credit for the tiny icons goes to passing_girl