26. Supernatural Wintery Mist
Layout Style: S2 Flexible Squares - with sidebar
Use Layout Stylesheet?: No
Custom external stylesheet?: No
Use external stylesheets?: No
Layout Width: 750 px
Requested By: flexible_square
Header Credit: serenitysangel!!!
Click for Live Preview or Click Here to see a version with bigger text.
Small Text Layout
/*------------------------------------------------------------------
S2 Flexible Squares
Layout by sireesanwar @ http://community.livejournal.com/layout_lounge/
PLEASE DO NOT REMOVE THIS SECTION
--------------------------------------------------------------------*/
body{
background-color: #222222;
background-image: url(BACKGROUND IMAGE URL HERE);
background-repeat: repeat;
color: #565656;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
margin: 20px 0 20px 0;
}
a, a:link, a:visited {
color: #30658c;
text-decoration: none;
}
a:hover {
color: #115578;
text-decoration: none;
}
blockquote {
padding: 18px;
border: 0px dotted #022d4c;
color: #565656;
font-size: 12px;
line-height: 13px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
background: #212121;
text-align: justify;
}
b, i, s, u, em, strong
{
color: #055d9d;
}
p, td{
}
code, kbd, pre, tt {
font-family: monospace;
}
ul.ljtaglist {
text-align: left;
padding-left: 5px;
}
/*-----------------------
SECTION: In General
-------------------------*/
#content {
width: 750px;
margin-left: auto;
margin-right: auto;
text-align: justify;
padding: 0px;
background-color: #191919;
border-color: #444444;
border-style: dotted;
border-width: 0px 1px 1px 1px;
}
#maincontent {
width: 530px;
float: right;
margin: 10px 0px 0px 10px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 11px;
color: #565656;
text-align: center;
}
.subcontent {
background-color: #191919;
width: 512px;
border-top: 0px dotted #022d4c;
border-bottom: 1px dotted #022d4c;
border-left: 0px dotted #022d4c;
border-right: 0px dotted #022d4c;
}
/*-----------------------
SECTION: Header
-----------------------*/
#header {
position: relative;
line-height: 35px;
text-align: center;
color: #555555;
font-family: "Dirty Ego";
font-size: 15px;
width: 100%;
padding: 0px 0px 10px 0px;
margin-bottom: 15px;
text-align: center;
letter-spacing: 1px;
text-transform: uppercase;
border-bottom: 0px dotted #022d4c;
}
div#header a, div#header a:link, div#header a:visited, div#footer a,
div#footer
div#header a, div#header a:link, div#header a:visited, div#header a:active {
padding: 9px;
font-family: "Dirty Ego";
font-size: 15px;
font-weight: normal;
text-transform: uppercase;
letter-spacing: -1px;
color: #555555;
text-align: center;
background-color: #191919;
}
div#header a:hover {
padding: 9px;
color: #000000;
background-color: #30658c;
border-bottom: 0px dotted;
}
ul.navheader
{
padding: 10px 0px 0px 0px;
background-color: #191919;
margin: 0px;
}
ul.navheader li {
display: inline;
padding: 10px 0px 0px 0px;
background-color: #191919;
margin: 0 2px;
}
.title, .subtitle {
display: none;
}
/*-----------------------
SECTION: Footer
-----------------------*/
#footer {
width: 100%;
margin: 0px;
text-align: center;
font-family: "georgia";
font-size: 10px;
color: #555555;
z-index: 100;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
/*-----------------------
SECTION: Sidebar
-------------------------*/
#sidebar {
padding: 0px 0 10px 0;
background-color: #191919;
margin-left: 5px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 10px;
color: #565656;
width: 200px;
float: left;
text-align: left;
text-transform: normal;
border-top: 0px dotted #022d4c;
border-bottom: 1px dotted #022d4c;
border-left: 0px dotted #022d4c;
border-right: 1px dotted #022d4c;
}
#sidebar .sbarcalendarposts a, #sidebar .sbarcalendarposts a:link,
.sbarcalendarposts
a:visited{
padding: 0px;
text-align: center;
}
#sidebar .sbarcalendarposts a:hover {
padding: 0px;
text-align: center;
}
#sidebar_tags .sbarcontent {
height: 300px;
overflow:auto;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #30658c;
display: block;
padding: 1px 1px 1px 0px;
text-decoration: none;
}
div#sidebar a:hover {
padding: 1px 1px 1px 0px;
color: #777777;
}
.defaultuserpic {
text-align: center;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px 5px 0px 5px;
}
.sbarbody2 {
padding: 0 15px 0 15px;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
padding: 1px;
border: 1px dotted #022d4c;
text-align: center;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 9px;
}
.sbarcalendarposts {
padding: 1px;
border: 1px dotted #022d4c;
background-color: #191919;
text-align: center;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 9px;
}
ul.sbarlist {
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbaritem {
padding-left: 0px;
border-bottom: 0px dotted #022d4c;
list-style: none;
}
li.sbartitle {
padding: 3px 5px 3px 5px;
margin: 10px 0 10px 0;
background-color: #222222;
list-style: none;
text-align: center;
color: #555555;
border-top: 0px dotted #022d4c;
text-transform: normal;
font-family: "Pea Alesa";
font-size: 12px;
}
ul.tagList {width: 100%;}
.tagBox {
height: 300px;
overflow-x: hidden;
overflow-y: scroll;
scrollbar-arrow-color: #30658c;
scrollbar-base-color: #191919;
scrollbar-face-color: #191919;
scrollbar-highlight-color: #30658c;
scrollbar-darkshadow-color: #555555;
scrollbar-shadow-color: #555555;
}
#sidebar_summary li.sbaritem {
color: #555555;
border: 1px dotted #022d4c;
background-color: #191919;
padding: 3px;
text-transform: normal;
margin: 3px 0px;
}
#sidebar_summary li.sbaritem a {
text-decoration: none;
display: inline !important;
color: #555555;
border: 0px dotted #022d4c !important;
background-color: transparent !important;
}
#sidebar_summary li.sbaritem a: hover{
text-decoration: none;
color: #007ba7;
border: 0px dotted #022d4c;
background-color: transparent !important;
}
/*-----------------------
SECTION: Entries
-------------------------*/
.entry {
padding: 10px;
margin: 0px;
color: #565656;
font-family: "arial";
font-size: 11px;
text-align: justify;
}
hr {
color: transparent;
height: 1px;
border-style : none;
border-bottom: 2px dotted #022d4c;
}
.entry ul li, ol li, li {
padding-left: 5px;
margin-left: 5px;
list-style: normal;
list-style-position: outside;
}
.userpic {
background-color: #191919 !important;
position: relative;
float: right;
padding: 5px;
margin: 10px;
z-index: 15;
color: #555555 !important;
border: 1px #115578 dotted;
}
.userpicfriends {
background-color: #191919 !important;
position: relative;
float: right;
padding: 5px;
margin: 10px;
text-align: center;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
z-index: 15;
border: 1px #115578 dotted;
}
.userpicfriends a font {
color: #5898c6;
}
.date {
padding-top: 5px;
padding-bottom: 5px;
text-align: left;
color: #565656;
top: 5px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 9px;
text-transform: uppercase;
}
.subject {
background-color: #191919;
font-weight: none;
padding-bottom: 5px;
padding-top: 5px;
padding-left: 10px;
color: #30658c;
font-family: "Pea Alesa";
font-size: 14px;
text-transform: normal;
text-decoration: underline;
border-bottom: 0px dotted #022d4c;
border-right: 0px dotted #022d4c;
}
.subject a, .subject a:link, .subject a:visited {
color: #30658c;
}
.subject a:hover {
color: #777777;
}
.datesubject {
background-color: transparent;
padding: 0px;
text-align: left;
border-left: 0px dotted #022d4c;
border-right: 0px dotted #022d4c;
border-top: 0px dotted #022d4c;
}
span.ljuser a b {
padding: 2px 0 2px 0;
color: #30658c;
font-weight: bold;
}
span.ljuser a:hover b {
padding-top: 2px;
padding-bottom: 2px;
color: #777777;
font-weight: lighter;
}
/*-----------------------
SECTION: Currents, tags, comment links
-------------------------*/
.ljtags {
margin-top: 5px;
color: #555555;
font-weight: lighter;
text-transform: lowercase;
margin: 15px 0px 0px 0px;
padding: 5px 0px 5px 17px;
background:
url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/tag_orange.png)
no-repeat center left;
}
.currents strong, .currentmood strong, .currentmusic .currentlocation,
.ljtags strong
{
font-family: "Silkscreen";
font-size: 10px;
color: #555555;
font-weight: lighter;
text-transform: lowercase;
}
.currents, .currentmood, .currentmusic, .currentlocation {
font-family: "Silkscreen";
font-size: 10px;
color: #555555;
font-weight: lighter;
text-transform: lowercase;
}
.ljtags a, .ljtags a:link, .ljtags a:visited {
font-family: "Silkscreen";
font-size: 10px;
color: #30658c;
text-transform: lowercase;
font-weight: lighter;
}
.currentlocation a, .currentlocation a:link, .currentlocation a:visited {
font-family: "Silkscreen";
font-size: 10px;
color: #30658c;
text-transform: lowercase;
font-weight: lighter;
}
.currentlocation a:hover, .ljtags a:hover {
font-family: "Silkscreen";
font-size: 10px;
color: #777777;
font-weight: lighter;
text-transform: lowercase;
}
.comments {
font-family: "king cool KC";
font-size: 12px;
text-align: center;
padding: 5px 5px 5px 5px;
position: relative;
clear: center;
margin-top: 5px;
text-transform: lowercase;
border-bottom: 1px #191919 dotted;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #30658c;
}
div.comments a:hover {
color: #115578;
text-decoration: none;
}
/*-----------------------
SECTION: Comments Page
-------------------------*/
.box {
padding: 10px;
margin-top: 0px;
text-align: left;
clear:right;
}
form div.box {
text-align:center;
}
.skiplinks {
text-transform: normal;
text-align: center;
padding: 10px 0 10px 0;
}
.datesubjectcomment {
margin-top: 20px;
text-align: right;
padding: 5px;
background-color: #222222;
color: #dddddd;
}
.userpiccomment {
background-color: #222222 !important;
position: relative;
top: -30px;
left: 0px;
padding: 5px;
margin: 20px 10px -20px 10px;
z-index: 15;
float: right;
border: 1px #115578 dotted;
color: $555555;
}
div#content input,
div#content textarea,
div#content select {
color: #555555;
border: 1px dotted #022d4c;
background-color:#222222;
}
textarea.textbox {
width: 100% !important;
}
.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
line-height: 125%;
color: #565656;
}
.replytosubject {
color: #666666;
font-weight: bold;
text-transform: normal;
padding: 5px;
background-color: #222222;
}
.replytoposter {
background-color: #222222;
color: #565656;
text-transform: normal;
padding: 5px;
}
.commentreply {
text-align: justify;
position: relative;
margin: 10px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
color: #565656;
}
.commentbox {
padding: 5px;
margin: 10px;
text-align: left;
background-color: #222222;
border: 1px dotted #022d4c;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #30658c;
}
.datesubjectcomment a:hover {
color: #777777;
}
.commentboxpartial {
padding: 10px;
margin: 10px;
background-color: #222222;
}
.commentinfo {
margin-top: 10px;
width: 100%;
}
/*-----------------------
SECTION: Year/Archive Page
-------------------------*/
ul.year {
text-align: center;
padding: 20px 0 20px 0;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border: 1px dotted #022d4c;
color: #555555;
}
table.yeartable td.yearday {
text-align: center;
color: #555555;
}
td.yearmonth {
color: #555555;
border-style: none;
}
/*-----------------------
SECTION: Tags Page
-------------------------*/
ul.ljtaglist {
color: #555555;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 10pt;
padding-left: 12px;
padding: 8px;
}
ul.ljtaglist li {
list-style: none;
}
/*-----------------------
SECTION: Tiny Icons
-------------------------*/
.subject img[src=http://stat.livejournal.com/img/icon_protected.gif]{
width: 0;
height: 0;
padding: 12px 9px 0px 0px !important;
background: url();
}
.subject img[src=http://stat.livejournal.com/img/icon_private.gif]{
width: 0;
height: 0;
padding: 9px 9px 0px 0px !important;
background: url();
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
background-image: url();
padding: 12px 7px 0 2px !important;
}
.ljuser img[src=http://stat.livejournal.com/img/userinfo.gif] {
background-color:transparent;
background-image: url();
padding: 12px 7px 0 2px !important;
}
.ljuser img[src=http://stat.livejournal.com/img/community.gif] {
background-color:transparent;
background-image: url();
padding: 11px 11px 0 2px !important;
}
/*-----------------------
SECTION: Mics
-------------------------*/
.clear {
height: 7px;
font-size: 0.01px;
}
#lj_controlstrip td {
font-family: georgia !important;
font-size: 10px;
background-color: #191919 !important;
border: 1px solid #333333;
}
#lj_controlstrip a {
font-family: georgia !important;
font-size: 10px;
color: #666666!important;
text-transform: lowercase;
}
.headerimage {
position: relative;
border-color: #444444;
border-style: dotted;
border-width: 1px 1px 0px 1px;
width: 750px;
height: 300px;
padding-left: 0px;
padding-right: 0x;
padding-bottom: 0px;
padding-top: 0px;
margin-left: auto;
margin-right: auto;
margin-top: 1px;
background-color: #191919;
background-image: url(YOUR HEADER URL HERE);
background-position: center;
background-repeat: no-repeat;
}
.separator {
height: 20px;
}
Larger Text Layout
/*------------------------------------------------------------------
S2 Flexible Squares
Layout by sireesanwar @ http://community.livejournal.com/layout_lounge/
PLEASE DO NOT REMOVE THIS SECTION
--------------------------------------------------------------------*/
body{
background-color: #222222;
background-image: url(BACKGROUND URL HERE);
background-repeat: repeat;
color: #565656;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
margin: 20px 0 20px 0;
}
a, a:link, a:visited {
color: #30658c;
text-decoration: none;
}
a:hover {
color: #115578;
text-decoration: none;
}
blockquote {
padding: 18px;
border: 0px dotted #022d4c;
color: #565656;
font-size: 12px;
line-height: 13px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
background: #212121;
text-align: justify;
}
b, i, s, u, em, strong
{
color: #055d9d;
}
p, td{
}
code, kbd, pre, tt {
font-family: monospace;
}
ul.ljtaglist {
text-align: left;
padding-left: 5px;
}
/*-----------------------
SECTION: In General
-------------------------*/
#content {
width: 750px;
margin-left: auto;
margin-right: auto;
text-align: justify;
padding: 0px;
background-color: #191919;
border-color: #444444;
border-style: dotted;
border-width: 0px 1px 1px 1px;
}
#maincontent {
width: 530px;
float: right;
margin: 10px 0px 0px 10px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
color: #565656;
text-align: center;
}
.subcontent {
background-color: #191919;
width: 512px;
border-top: 0px dotted #022d4c;
border-bottom: 1px dotted #022d4c;
border-left: 0px dotted #022d4c;
border-right: 0px dotted #022d4c;
}
/*-----------------------
SECTION: Header
-----------------------*/
#header {
position: relative;
line-height: 35px;
text-align: center;
color: #555555;
font-family: "Dirty Ego";
font-size: 25px;
width: 100%;
padding: 0px 0px 10px 0px;
margin-bottom: 15px;
text-align: center;
letter-spacing: 1px;
text-transform: uppercase;
border-bottom: 0px dotted #022d4c;
}
div#header a, div#header a:link, div#header a:visited, div#footer a,
div#footer
div#header a, div#header a:link, div#header a:visited, div#header a:active {
padding: 9px;
font-family: "Dirty Ego";
font-size: 25px;
font-weight: normal;
text-transform: uppercase;
letter-spacing: -1px;
color: #555555;
text-align: center;
background-color: #191919;
}
div#header a:hover {
padding: 9px;
color: #000000;
background-color: #30658c;
border-bottom: 0px dotted;
}
ul.navheader
{
padding: 10px 0px 0px 0px;
background-color: #191919;
margin: 0px;
}
ul.navheader li {
display: inline;
padding: 10px 0px 0px 0px;
background-color: #191919;
margin: 0 2px;
}
.title, .subtitle {
display: none;
}
/*-----------------------
SECTION: Footer
-----------------------*/
#footer {
width: 100%;
margin: 0px;
text-align: center;
font-family: "georgia";
font-size: 10px;
color: #555555;
z-index: 100;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
/*-----------------------
SECTION: Sidebar
-------------------------*/
#sidebar {
padding: 0px 0 10px 0;
background-color: #191919;
margin-left: 5px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 11px;
color: #565656;
width: 200px;
float: left;
text-align: left;
text-transform: normal;
border-top: 0px dotted #022d4c;
border-bottom: 1px dotted #022d4c;
border-left: 0px dotted #022d4c;
border-right: 1px dotted #022d4c;
}
#sidebar .sbarcalendarposts a, #sidebar .sbarcalendarposts a:link,
.sbarcalendarposts
a:visited{
padding: 0px;
text-align: center;
}
#sidebar .sbarcalendarposts a:hover {
padding: 0px;
text-align: center;
}
#sidebar_tags .sbarcontent {
height: 300px;
overflow:auto;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #30658c;
display: block;
padding: 1px 1px 1px 0px;
text-decoration: none;
}
div#sidebar a:hover {
padding: 1px 1px 1px 0px;
color: #777777;
}
.defaultuserpic {
text-align: center;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px 5px 0px 5px;
}
.sbarbody2 {
padding: 0 15px 0 15px;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
padding: 1px;
border: 1px dotted #022d4c;
text-align: center;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 9px;
}
.sbarcalendarposts {
padding: 1px;
border: 1px dotted #022d4c;
background-color: #191919;
text-align: center;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 9px;
}
ul.sbarlist {
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbaritem {
padding-left: 0px;
border-bottom: 0px dotted #022d4c;
list-style: none;
}
li.sbartitle {
padding: 3px 5px 3px 5px;
margin: 10px 0 10px 0;
background-color: #222222;
list-style: none;
text-align: center;
color: #555555;
border-top: 0px dotted #022d4c;
text-transform: normal;
font-family: "Pea Alesa";
font-size: 14px;
}
ul.tagList {width: 100%;}
.tagBox {
height: 300px;
overflow-x: hidden;
overflow-y: scroll;
scrollbar-arrow-color: #30658c;
scrollbar-base-color: #191919;
scrollbar-face-color: #191919;
scrollbar-highlight-color: #30658c;
scrollbar-darkshadow-color: #555555;
scrollbar-shadow-color: #555555;
}
#sidebar_summary li.sbaritem {
color: #555555;
border: 1px dotted #022d4c;
background-color: #191919;
padding: 3px;
text-transform: normal;
margin: 3px 0px;
}
#sidebar_summary li.sbaritem a {
text-decoration: none;
display: inline !important;
color: #555555;
border: 0px dotted #022d4c !important;
background-color: transparent !important;
}
#sidebar_summary li.sbaritem a: hover{
text-decoration: none;
color: #007ba7;
border: 0px dotted #022d4c;
background-color: transparent !important;
}
/*-----------------------
SECTION: Entries
-------------------------*/
.entry {
padding: 10px;
margin: 0px;
color: #565656;
font-family: "arial";
font-size: 12px;
text-align: justify;
}
hr {
color: transparent;
height: 1px;
border-style : none;
border-bottom: 2px dotted #022d4c;
}
.entry ul li, ol li, li {
padding-left: 5px;
margin-left: 5px;
list-style: normal;
list-style-position: outside;
}
.userpic {
background-color: #191919 !important;
position: relative;
float: right;
padding: 5px;
margin: 10px;
z-index: 15;
color: #555555 !important;
border: 1px #115578 dotted;
}
.userpicfriends {
background-color: #191919 !important;
position: relative;
float: right;
padding: 5px;
margin: 10px;
text-align: center;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
z-index: 15;
border: 1px #115578 dotted;
}
.userpicfriends a font {
color: #5898c6;
}
.date {
padding-top: 5px;
padding-bottom: 5px;
text-align: left;
color: #565656;
top: 5px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 10px;
text-transform: uppercase;
}
.subject {
background-color: #191919;
font-weight: none;
padding-bottom: 5px;
padding-top: 5px;
padding-left: 10px;
color: #30658c;
font-family: "Pea Alesa";
font-size: 16px;
text-transform: normal;
text-decoration: underline;
border-bottom: 0px dotted #022d4c;
border-right: 0px dotted #022d4c;
}
.subject a, .subject a:link, .subject a:visited {
color: #30658c;
}
.subject a:hover {
color: #777777;
}
.datesubject {
background-color: transparent;
padding: 0px;
text-align: left;
border-left: 0px dotted #022d4c;
border-right: 0px dotted #022d4c;
border-top: 0px dotted #022d4c;
}
span.ljuser a b {
padding: 2px 0 2px 0;
color: #30658c;
font-weight: bold;
}
span.ljuser a:hover b {
padding-top: 2px;
padding-bottom: 2px;
color: #777777;
font-weight: lighter;
}
/*-----------------------
SECTION: Currents, tags, comment links
-------------------------*/
.ljtags {
margin-top: 5px;
color: #555555;
font-weight: lighter;
text-transform: lowercase;
margin: 15px 0px 0px 0px;
padding: 5px 0px 5px 17px;
background:
url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/tag_orange.png)
no-repeat center left;
}
.currents strong, .currentmood strong, .currentmusic .currentlocation,
.ljtags strong
{
font-family: "Silkscreen";
font-size: 10px;
color: #555555;
font-weight: lighter;
text-transform: lowercase;
}
.currents, .currentmood, .currentmusic, .currentlocation {
font-family: "Silkscreen";
font-size: 10px;
color: #555555;
font-weight: lighter;
text-transform: lowercase;
}
.ljtags a, .ljtags a:link, .ljtags a:visited {
font-family: "Silkscreen";
font-size: 10px;
color: #30658c;
text-transform: lowercase;
font-weight: lighter;
}
.currentlocation a, .currentlocation a:link, .currentlocation a:visited {
font-family: "Silkscreen";
font-size: 10px;
color: #30658c;
text-transform: lowercase;
font-weight: lighter;
}
.currentlocation a:hover, .ljtags a:hover {
font-family: "Silkscreen";
font-size: 10px;
color: #777777;
font-weight: lighter;
text-transform: lowercase;
}
.comments {
font-family: "king cool KC";
font-size: 12px;
text-align: center;
padding: 5px 5px 5px 5px;
position: relative;
clear: center;
margin-top: 5px;
text-transform: lowercase;
border-bottom: 1px #191919 dotted;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #30658c;
}
div.comments a:hover {
color: #115578;
text-decoration: none;
}
/*-----------------------
SECTION: Comments Page
-------------------------*/
.box {
padding: 10px;
margin-top: 0px;
text-align: left;
clear:right;
}
form div.box {
text-align:center;
}
.skiplinks {
text-transform: normal;
text-align: center;
padding: 10px 0 10px 0;
}
.datesubjectcomment {
margin-top: 20px;
text-align: right;
padding: 5px;
background-color: #222222;
color: #dddddd;
}
.userpiccomment {
background-color: #222222 !important;
position: relative;
top: -30px;
left: 0px;
padding: 5px;
margin: 20px 10px -20px 10px;
z-index: 15;
float: right;
border: 1px #115578 dotted;
color: $555555;
}
div#content input,
div#content textarea,
div#content select {
color: #555555;
border: 1px dotted #022d4c;
background-color:#222222;
}
textarea.textbox {
width: 100% !important;
}
.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
line-height: 125%;
color: #565656;
}
.replytosubject {
color: #666666;
font-weight: bold;
text-transform: normal;
padding: 5px;
background-color: #222222;
}
.replytoposter {
background-color: #222222;
color: #565656;
text-transform: normal;
padding: 5px;
}
.commentreply {
text-align: justify;
position: relative;
margin: 10px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
color: #565656;
}
.commentbox {
padding: 5px;
margin: 10px;
text-align: left;
background-color: #222222;
border: 1px dotted #022d4c;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #30658c;
}
.datesubjectcomment a:hover {
color: #777777;
}
.commentboxpartial {
padding: 10px;
margin: 10px;
background-color: #222222;
}
.commentinfo {
margin-top: 10px;
width: 100%;
}
/*-----------------------
SECTION: Year/Archive Page
-------------------------*/
ul.year {
text-align: center;
padding: 20px 0 20px 0;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border: 1px dotted #022d4c;
color: #555555;
}
table.yeartable td.yearday {
text-align: center;
color: #555555;
}
td.yearmonth {
color: #555555;
border-style: none;
}
/*-----------------------
SECTION: Tags Page
-------------------------*/
ul.ljtaglist {
color: #555555;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 10pt;
padding-left: 12px;
padding: 8px;
}
ul.ljtaglist li {
list-style: none;
}
/*-----------------------
SECTION: Tiny Icons
-------------------------*/
.subject img[src=http://stat.livejournal.com/img/icon_protected.gif]{
width: 0;
height: 0;
padding: 12px 9px 0px 0px !important;
background: url();
}
.subject img[src=http://stat.livejournal.com/img/icon_private.gif]{
width: 0;
height: 0;
padding: 9px 9px 0px 0px !important;
background: url();
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
background-image: url();
padding: 12px 7px 0 2px !important;
}
.ljuser img[src=http://stat.livejournal.com/img/userinfo.gif] {
background-color:transparent;
background-image: url();
padding: 12px 7px 0 2px !important;
}
.ljuser img[src=http://stat.livejournal.com/img/community.gif] {
background-color:transparent;
background-image: url();
padding: 11px 11px 0 2px !important;
}
/*-----------------------
SECTION: Mics
-------------------------*/
.clear {
height: 7px;
font-size: 0.01px;
}
#lj_controlstrip td {
font-family: georgia !important;
font-size: 11px;
background-color: #191919 !important;
border: 1px solid #333333;
}
#lj_controlstrip a {
font-family: georgia !important;
font-size: 11px;
color: #666666!important;
text-transform: lowercase;
}
.headerimage {
position: relative;
border-color: #444444;
border-style: dotted;
border-width: 1px 1px 0px 1px;
width: 750px;
height: 300px;
padding-left: 0px;
padding-right: 0x;
padding-bottom: 0px;
padding-top: 0px;
margin-left: auto;
margin-right: auto;
margin-top: 1px;
background-color: #191919;
background-image: url(HEADER IMAGE URL);
background-position: center;
background-repeat: no-repeat;
}
.separator {
height: 20px;
}
Header 750 x 300 made by serenitysangel
Header 750 x 300 made by serenitysangel
Background - insert at top of coding, looks nice behind layout
Fonts Used:
Dirty Ego
Pea Alesa
king cool KC
See the Font Tutorial if you need help adding these fonts to your computer system.
Check out Using Layouts on the sidebar for any extra assistance.
Please direct people to layout_lounge. Please credit serenitysangel for the lovely headers.
Use Layout Stylesheet?: No
Custom external stylesheet?: No
Use external stylesheets?: No
Layout Width: 750 px
Requested By: flexible_square
Header Credit: serenitysangel!!!
Click for Live Preview or Click Here to see a version with bigger text.
Small Text Layout
/*------------------------------------------------------------------
S2 Flexible Squares
Layout by sireesanwar @ http://community.livejournal.com/layout_lounge/
PLEASE DO NOT REMOVE THIS SECTION
--------------------------------------------------------------------*/
body{
background-color: #222222;
background-image: url(BACKGROUND IMAGE URL HERE);
background-repeat: repeat;
color: #565656;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
margin: 20px 0 20px 0;
}
a, a:link, a:visited {
color: #30658c;
text-decoration: none;
}
a:hover {
color: #115578;
text-decoration: none;
}
blockquote {
padding: 18px;
border: 0px dotted #022d4c;
color: #565656;
font-size: 12px;
line-height: 13px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
background: #212121;
text-align: justify;
}
b, i, s, u, em, strong
{
color: #055d9d;
}
p, td{
}
code, kbd, pre, tt {
font-family: monospace;
}
ul.ljtaglist {
text-align: left;
padding-left: 5px;
}
/*-----------------------
SECTION: In General
-------------------------*/
#content {
width: 750px;
margin-left: auto;
margin-right: auto;
text-align: justify;
padding: 0px;
background-color: #191919;
border-color: #444444;
border-style: dotted;
border-width: 0px 1px 1px 1px;
}
#maincontent {
width: 530px;
float: right;
margin: 10px 0px 0px 10px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 11px;
color: #565656;
text-align: center;
}
.subcontent {
background-color: #191919;
width: 512px;
border-top: 0px dotted #022d4c;
border-bottom: 1px dotted #022d4c;
border-left: 0px dotted #022d4c;
border-right: 0px dotted #022d4c;
}
/*-----------------------
SECTION: Header
-----------------------*/
#header {
position: relative;
line-height: 35px;
text-align: center;
color: #555555;
font-family: "Dirty Ego";
font-size: 15px;
width: 100%;
padding: 0px 0px 10px 0px;
margin-bottom: 15px;
text-align: center;
letter-spacing: 1px;
text-transform: uppercase;
border-bottom: 0px dotted #022d4c;
}
div#header a, div#header a:link, div#header a:visited, div#footer a,
div#footer
div#header a, div#header a:link, div#header a:visited, div#header a:active {
padding: 9px;
font-family: "Dirty Ego";
font-size: 15px;
font-weight: normal;
text-transform: uppercase;
letter-spacing: -1px;
color: #555555;
text-align: center;
background-color: #191919;
}
div#header a:hover {
padding: 9px;
color: #000000;
background-color: #30658c;
border-bottom: 0px dotted;
}
ul.navheader
{
padding: 10px 0px 0px 0px;
background-color: #191919;
margin: 0px;
}
ul.navheader li {
display: inline;
padding: 10px 0px 0px 0px;
background-color: #191919;
margin: 0 2px;
}
.title, .subtitle {
display: none;
}
/*-----------------------
SECTION: Footer
-----------------------*/
#footer {
width: 100%;
margin: 0px;
text-align: center;
font-family: "georgia";
font-size: 10px;
color: #555555;
z-index: 100;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
/*-----------------------
SECTION: Sidebar
-------------------------*/
#sidebar {
padding: 0px 0 10px 0;
background-color: #191919;
margin-left: 5px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 10px;
color: #565656;
width: 200px;
float: left;
text-align: left;
text-transform: normal;
border-top: 0px dotted #022d4c;
border-bottom: 1px dotted #022d4c;
border-left: 0px dotted #022d4c;
border-right: 1px dotted #022d4c;
}
#sidebar .sbarcalendarposts a, #sidebar .sbarcalendarposts a:link,
.sbarcalendarposts
a:visited{
padding: 0px;
text-align: center;
}
#sidebar .sbarcalendarposts a:hover {
padding: 0px;
text-align: center;
}
#sidebar_tags .sbarcontent {
height: 300px;
overflow:auto;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #30658c;
display: block;
padding: 1px 1px 1px 0px;
text-decoration: none;
}
div#sidebar a:hover {
padding: 1px 1px 1px 0px;
color: #777777;
}
.defaultuserpic {
text-align: center;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px 5px 0px 5px;
}
.sbarbody2 {
padding: 0 15px 0 15px;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
padding: 1px;
border: 1px dotted #022d4c;
text-align: center;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 9px;
}
.sbarcalendarposts {
padding: 1px;
border: 1px dotted #022d4c;
background-color: #191919;
text-align: center;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 9px;
}
ul.sbarlist {
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbaritem {
padding-left: 0px;
border-bottom: 0px dotted #022d4c;
list-style: none;
}
li.sbartitle {
padding: 3px 5px 3px 5px;
margin: 10px 0 10px 0;
background-color: #222222;
list-style: none;
text-align: center;
color: #555555;
border-top: 0px dotted #022d4c;
text-transform: normal;
font-family: "Pea Alesa";
font-size: 12px;
}
ul.tagList {width: 100%;}
.tagBox {
height: 300px;
overflow-x: hidden;
overflow-y: scroll;
scrollbar-arrow-color: #30658c;
scrollbar-base-color: #191919;
scrollbar-face-color: #191919;
scrollbar-highlight-color: #30658c;
scrollbar-darkshadow-color: #555555;
scrollbar-shadow-color: #555555;
}
#sidebar_summary li.sbaritem {
color: #555555;
border: 1px dotted #022d4c;
background-color: #191919;
padding: 3px;
text-transform: normal;
margin: 3px 0px;
}
#sidebar_summary li.sbaritem a {
text-decoration: none;
display: inline !important;
color: #555555;
border: 0px dotted #022d4c !important;
background-color: transparent !important;
}
#sidebar_summary li.sbaritem a: hover{
text-decoration: none;
color: #007ba7;
border: 0px dotted #022d4c;
background-color: transparent !important;
}
/*-----------------------
SECTION: Entries
-------------------------*/
.entry {
padding: 10px;
margin: 0px;
color: #565656;
font-family: "arial";
font-size: 11px;
text-align: justify;
}
hr {
color: transparent;
height: 1px;
border-style : none;
border-bottom: 2px dotted #022d4c;
}
.entry ul li, ol li, li {
padding-left: 5px;
margin-left: 5px;
list-style: normal;
list-style-position: outside;
}
.userpic {
background-color: #191919 !important;
position: relative;
float: right;
padding: 5px;
margin: 10px;
z-index: 15;
color: #555555 !important;
border: 1px #115578 dotted;
}
.userpicfriends {
background-color: #191919 !important;
position: relative;
float: right;
padding: 5px;
margin: 10px;
text-align: center;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
z-index: 15;
border: 1px #115578 dotted;
}
.userpicfriends a font {
color: #5898c6;
}
.date {
padding-top: 5px;
padding-bottom: 5px;
text-align: left;
color: #565656;
top: 5px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 9px;
text-transform: uppercase;
}
.subject {
background-color: #191919;
font-weight: none;
padding-bottom: 5px;
padding-top: 5px;
padding-left: 10px;
color: #30658c;
font-family: "Pea Alesa";
font-size: 14px;
text-transform: normal;
text-decoration: underline;
border-bottom: 0px dotted #022d4c;
border-right: 0px dotted #022d4c;
}
.subject a, .subject a:link, .subject a:visited {
color: #30658c;
}
.subject a:hover {
color: #777777;
}
.datesubject {
background-color: transparent;
padding: 0px;
text-align: left;
border-left: 0px dotted #022d4c;
border-right: 0px dotted #022d4c;
border-top: 0px dotted #022d4c;
}
span.ljuser a b {
padding: 2px 0 2px 0;
color: #30658c;
font-weight: bold;
}
span.ljuser a:hover b {
padding-top: 2px;
padding-bottom: 2px;
color: #777777;
font-weight: lighter;
}
/*-----------------------
SECTION: Currents, tags, comment links
-------------------------*/
.ljtags {
margin-top: 5px;
color: #555555;
font-weight: lighter;
text-transform: lowercase;
margin: 15px 0px 0px 0px;
padding: 5px 0px 5px 17px;
background:
url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/tag_orange.png)
no-repeat center left;
}
.currents strong, .currentmood strong, .currentmusic .currentlocation,
.ljtags strong
{
font-family: "Silkscreen";
font-size: 10px;
color: #555555;
font-weight: lighter;
text-transform: lowercase;
}
.currents, .currentmood, .currentmusic, .currentlocation {
font-family: "Silkscreen";
font-size: 10px;
color: #555555;
font-weight: lighter;
text-transform: lowercase;
}
.ljtags a, .ljtags a:link, .ljtags a:visited {
font-family: "Silkscreen";
font-size: 10px;
color: #30658c;
text-transform: lowercase;
font-weight: lighter;
}
.currentlocation a, .currentlocation a:link, .currentlocation a:visited {
font-family: "Silkscreen";
font-size: 10px;
color: #30658c;
text-transform: lowercase;
font-weight: lighter;
}
.currentlocation a:hover, .ljtags a:hover {
font-family: "Silkscreen";
font-size: 10px;
color: #777777;
font-weight: lighter;
text-transform: lowercase;
}
.comments {
font-family: "king cool KC";
font-size: 12px;
text-align: center;
padding: 5px 5px 5px 5px;
position: relative;
clear: center;
margin-top: 5px;
text-transform: lowercase;
border-bottom: 1px #191919 dotted;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #30658c;
}
div.comments a:hover {
color: #115578;
text-decoration: none;
}
/*-----------------------
SECTION: Comments Page
-------------------------*/
.box {
padding: 10px;
margin-top: 0px;
text-align: left;
clear:right;
}
form div.box {
text-align:center;
}
.skiplinks {
text-transform: normal;
text-align: center;
padding: 10px 0 10px 0;
}
.datesubjectcomment {
margin-top: 20px;
text-align: right;
padding: 5px;
background-color: #222222;
color: #dddddd;
}
.userpiccomment {
background-color: #222222 !important;
position: relative;
top: -30px;
left: 0px;
padding: 5px;
margin: 20px 10px -20px 10px;
z-index: 15;
float: right;
border: 1px #115578 dotted;
color: $555555;
}
div#content input,
div#content textarea,
div#content select {
color: #555555;
border: 1px dotted #022d4c;
background-color:#222222;
}
textarea.textbox {
width: 100% !important;
}
.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
line-height: 125%;
color: #565656;
}
.replytosubject {
color: #666666;
font-weight: bold;
text-transform: normal;
padding: 5px;
background-color: #222222;
}
.replytoposter {
background-color: #222222;
color: #565656;
text-transform: normal;
padding: 5px;
}
.commentreply {
text-align: justify;
position: relative;
margin: 10px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
color: #565656;
}
.commentbox {
padding: 5px;
margin: 10px;
text-align: left;
background-color: #222222;
border: 1px dotted #022d4c;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #30658c;
}
.datesubjectcomment a:hover {
color: #777777;
}
.commentboxpartial {
padding: 10px;
margin: 10px;
background-color: #222222;
}
.commentinfo {
margin-top: 10px;
width: 100%;
}
/*-----------------------
SECTION: Year/Archive Page
-------------------------*/
ul.year {
text-align: center;
padding: 20px 0 20px 0;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border: 1px dotted #022d4c;
color: #555555;
}
table.yeartable td.yearday {
text-align: center;
color: #555555;
}
td.yearmonth {
color: #555555;
border-style: none;
}
/*-----------------------
SECTION: Tags Page
-------------------------*/
ul.ljtaglist {
color: #555555;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 10pt;
padding-left: 12px;
padding: 8px;
}
ul.ljtaglist li {
list-style: none;
}
/*-----------------------
SECTION: Tiny Icons
-------------------------*/
.subject img[src=http://stat.livejournal.com/img/icon_protected.gif]{
![http://stat.livejournal.com/img/icon_protected.gif]{](http://stat.livejournal.com/img/icon_protected.gif]{){kind=link}
width: 0;
height: 0;
padding: 12px 9px 0px 0px !important;
background: url();
}
.subject img[src=http://stat.livejournal.com/img/icon_private.gif]{
![http://stat.livejournal.com/img/icon_private.gif]{](http://stat.livejournal.com/img/icon_private.gif]{){kind=link}
width: 0;
height: 0;
padding: 9px 9px 0px 0px !important;
background: url();
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
background-image: url();
padding: 12px 7px 0 2px !important;
}
.ljuser img[src=http://stat.livejournal.com/img/userinfo.gif] {
![http://stat.livejournal.com/img/userinfo.gif]](http://stat.livejournal.com/img/userinfo.gif]){kind=link}
background-color:transparent;
background-image: url();
padding: 12px 7px 0 2px !important;
}
.ljuser img[src=http://stat.livejournal.com/img/community.gif] {
![http://stat.livejournal.com/img/community.gif]](http://stat.livejournal.com/img/community.gif]){kind=link}
background-color:transparent;
background-image: url();
padding: 11px 11px 0 2px !important;
}
/*-----------------------
SECTION: Mics
-------------------------*/
.clear {
height: 7px;
font-size: 0.01px;
}
#lj_controlstrip td {
font-family: georgia !important;
font-size: 10px;
background-color: #191919 !important;
border: 1px solid #333333;
}
#lj_controlstrip a {
font-family: georgia !important;
font-size: 10px;
color: #666666!important;
text-transform: lowercase;
}
.headerimage {
position: relative;
border-color: #444444;
border-style: dotted;
border-width: 1px 1px 0px 1px;
width: 750px;
height: 300px;
padding-left: 0px;
padding-right: 0x;
padding-bottom: 0px;
padding-top: 0px;
margin-left: auto;
margin-right: auto;
margin-top: 1px;
background-color: #191919;
background-image: url(YOUR HEADER URL HERE);
background-position: center;
background-repeat: no-repeat;
}
.separator {
height: 20px;
}
Larger Text Layout
/*------------------------------------------------------------------
S2 Flexible Squares
Layout by sireesanwar @ http://community.livejournal.com/layout_lounge/
PLEASE DO NOT REMOVE THIS SECTION
--------------------------------------------------------------------*/
body{
background-color: #222222;
background-image: url(BACKGROUND URL HERE);
background-repeat: repeat;
color: #565656;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
margin: 20px 0 20px 0;
}
a, a:link, a:visited {
color: #30658c;
text-decoration: none;
}
a:hover {
color: #115578;
text-decoration: none;
}
blockquote {
padding: 18px;
border: 0px dotted #022d4c;
color: #565656;
font-size: 12px;
line-height: 13px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
background: #212121;
text-align: justify;
}
b, i, s, u, em, strong
{
color: #055d9d;
}
p, td{
}
code, kbd, pre, tt {
font-family: monospace;
}
ul.ljtaglist {
text-align: left;
padding-left: 5px;
}
/*-----------------------
SECTION: In General
-------------------------*/
#content {
width: 750px;
margin-left: auto;
margin-right: auto;
text-align: justify;
padding: 0px;
background-color: #191919;
border-color: #444444;
border-style: dotted;
border-width: 0px 1px 1px 1px;
}
#maincontent {
width: 530px;
float: right;
margin: 10px 0px 0px 10px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
color: #565656;
text-align: center;
}
.subcontent {
background-color: #191919;
width: 512px;
border-top: 0px dotted #022d4c;
border-bottom: 1px dotted #022d4c;
border-left: 0px dotted #022d4c;
border-right: 0px dotted #022d4c;
}
/*-----------------------
SECTION: Header
-----------------------*/
#header {
position: relative;
line-height: 35px;
text-align: center;
color: #555555;
font-family: "Dirty Ego";
font-size: 25px;
width: 100%;
padding: 0px 0px 10px 0px;
margin-bottom: 15px;
text-align: center;
letter-spacing: 1px;
text-transform: uppercase;
border-bottom: 0px dotted #022d4c;
}
div#header a, div#header a:link, div#header a:visited, div#footer a,
div#footer
div#header a, div#header a:link, div#header a:visited, div#header a:active {
padding: 9px;
font-family: "Dirty Ego";
font-size: 25px;
font-weight: normal;
text-transform: uppercase;
letter-spacing: -1px;
color: #555555;
text-align: center;
background-color: #191919;
}
div#header a:hover {
padding: 9px;
color: #000000;
background-color: #30658c;
border-bottom: 0px dotted;
}
ul.navheader
{
padding: 10px 0px 0px 0px;
background-color: #191919;
margin: 0px;
}
ul.navheader li {
display: inline;
padding: 10px 0px 0px 0px;
background-color: #191919;
margin: 0 2px;
}
.title, .subtitle {
display: none;
}
/*-----------------------
SECTION: Footer
-----------------------*/
#footer {
width: 100%;
margin: 0px;
text-align: center;
font-family: "georgia";
font-size: 10px;
color: #555555;
z-index: 100;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
/*-----------------------
SECTION: Sidebar
-------------------------*/
#sidebar {
padding: 0px 0 10px 0;
background-color: #191919;
margin-left: 5px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 11px;
color: #565656;
width: 200px;
float: left;
text-align: left;
text-transform: normal;
border-top: 0px dotted #022d4c;
border-bottom: 1px dotted #022d4c;
border-left: 0px dotted #022d4c;
border-right: 1px dotted #022d4c;
}
#sidebar .sbarcalendarposts a, #sidebar .sbarcalendarposts a:link,
.sbarcalendarposts
a:visited{
padding: 0px;
text-align: center;
}
#sidebar .sbarcalendarposts a:hover {
padding: 0px;
text-align: center;
}
#sidebar_tags .sbarcontent {
height: 300px;
overflow:auto;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #30658c;
display: block;
padding: 1px 1px 1px 0px;
text-decoration: none;
}
div#sidebar a:hover {
padding: 1px 1px 1px 0px;
color: #777777;
}
.defaultuserpic {
text-align: center;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px 5px 0px 5px;
}
.sbarbody2 {
padding: 0 15px 0 15px;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
padding: 1px;
border: 1px dotted #022d4c;
text-align: center;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 9px;
}
.sbarcalendarposts {
padding: 1px;
border: 1px dotted #022d4c;
background-color: #191919;
text-align: center;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 9px;
}
ul.sbarlist {
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbaritem {
padding-left: 0px;
border-bottom: 0px dotted #022d4c;
list-style: none;
}
li.sbartitle {
padding: 3px 5px 3px 5px;
margin: 10px 0 10px 0;
background-color: #222222;
list-style: none;
text-align: center;
color: #555555;
border-top: 0px dotted #022d4c;
text-transform: normal;
font-family: "Pea Alesa";
font-size: 14px;
}
ul.tagList {width: 100%;}
.tagBox {
height: 300px;
overflow-x: hidden;
overflow-y: scroll;
scrollbar-arrow-color: #30658c;
scrollbar-base-color: #191919;
scrollbar-face-color: #191919;
scrollbar-highlight-color: #30658c;
scrollbar-darkshadow-color: #555555;
scrollbar-shadow-color: #555555;
}
#sidebar_summary li.sbaritem {
color: #555555;
border: 1px dotted #022d4c;
background-color: #191919;
padding: 3px;
text-transform: normal;
margin: 3px 0px;
}
#sidebar_summary li.sbaritem a {
text-decoration: none;
display: inline !important;
color: #555555;
border: 0px dotted #022d4c !important;
background-color: transparent !important;
}
#sidebar_summary li.sbaritem a: hover{
text-decoration: none;
color: #007ba7;
border: 0px dotted #022d4c;
background-color: transparent !important;
}
/*-----------------------
SECTION: Entries
-------------------------*/
.entry {
padding: 10px;
margin: 0px;
color: #565656;
font-family: "arial";
font-size: 12px;
text-align: justify;
}
hr {
color: transparent;
height: 1px;
border-style : none;
border-bottom: 2px dotted #022d4c;
}
.entry ul li, ol li, li {
padding-left: 5px;
margin-left: 5px;
list-style: normal;
list-style-position: outside;
}
.userpic {
background-color: #191919 !important;
position: relative;
float: right;
padding: 5px;
margin: 10px;
z-index: 15;
color: #555555 !important;
border: 1px #115578 dotted;
}
.userpicfriends {
background-color: #191919 !important;
position: relative;
float: right;
padding: 5px;
margin: 10px;
text-align: center;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
z-index: 15;
border: 1px #115578 dotted;
}
.userpicfriends a font {
color: #5898c6;
}
.date {
padding-top: 5px;
padding-bottom: 5px;
text-align: left;
color: #565656;
top: 5px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 10px;
text-transform: uppercase;
}
.subject {
background-color: #191919;
font-weight: none;
padding-bottom: 5px;
padding-top: 5px;
padding-left: 10px;
color: #30658c;
font-family: "Pea Alesa";
font-size: 16px;
text-transform: normal;
text-decoration: underline;
border-bottom: 0px dotted #022d4c;
border-right: 0px dotted #022d4c;
}
.subject a, .subject a:link, .subject a:visited {
color: #30658c;
}
.subject a:hover {
color: #777777;
}
.datesubject {
background-color: transparent;
padding: 0px;
text-align: left;
border-left: 0px dotted #022d4c;
border-right: 0px dotted #022d4c;
border-top: 0px dotted #022d4c;
}
span.ljuser a b {
padding: 2px 0 2px 0;
color: #30658c;
font-weight: bold;
}
span.ljuser a:hover b {
padding-top: 2px;
padding-bottom: 2px;
color: #777777;
font-weight: lighter;
}
/*-----------------------
SECTION: Currents, tags, comment links
-------------------------*/
.ljtags {
margin-top: 5px;
color: #555555;
font-weight: lighter;
text-transform: lowercase;
margin: 15px 0px 0px 0px;
padding: 5px 0px 5px 17px;
background:
url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/tag_orange.png)
no-repeat center left;
}
.currents strong, .currentmood strong, .currentmusic .currentlocation,
.ljtags strong
{
font-family: "Silkscreen";
font-size: 10px;
color: #555555;
font-weight: lighter;
text-transform: lowercase;
}
.currents, .currentmood, .currentmusic, .currentlocation {
font-family: "Silkscreen";
font-size: 10px;
color: #555555;
font-weight: lighter;
text-transform: lowercase;
}
.ljtags a, .ljtags a:link, .ljtags a:visited {
font-family: "Silkscreen";
font-size: 10px;
color: #30658c;
text-transform: lowercase;
font-weight: lighter;
}
.currentlocation a, .currentlocation a:link, .currentlocation a:visited {
font-family: "Silkscreen";
font-size: 10px;
color: #30658c;
text-transform: lowercase;
font-weight: lighter;
}
.currentlocation a:hover, .ljtags a:hover {
font-family: "Silkscreen";
font-size: 10px;
color: #777777;
font-weight: lighter;
text-transform: lowercase;
}
.comments {
font-family: "king cool KC";
font-size: 12px;
text-align: center;
padding: 5px 5px 5px 5px;
position: relative;
clear: center;
margin-top: 5px;
text-transform: lowercase;
border-bottom: 1px #191919 dotted;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #30658c;
}
div.comments a:hover {
color: #115578;
text-decoration: none;
}
/*-----------------------
SECTION: Comments Page
-------------------------*/
.box {
padding: 10px;
margin-top: 0px;
text-align: left;
clear:right;
}
form div.box {
text-align:center;
}
.skiplinks {
text-transform: normal;
text-align: center;
padding: 10px 0 10px 0;
}
.datesubjectcomment {
margin-top: 20px;
text-align: right;
padding: 5px;
background-color: #222222;
color: #dddddd;
}
.userpiccomment {
background-color: #222222 !important;
position: relative;
top: -30px;
left: 0px;
padding: 5px;
margin: 20px 10px -20px 10px;
z-index: 15;
float: right;
border: 1px #115578 dotted;
color: $555555;
}
div#content input,
div#content textarea,
div#content select {
color: #555555;
border: 1px dotted #022d4c;
background-color:#222222;
}
textarea.textbox {
width: 100% !important;
}
.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
line-height: 125%;
color: #565656;
}
.replytosubject {
color: #666666;
font-weight: bold;
text-transform: normal;
padding: 5px;
background-color: #222222;
}
.replytoposter {
background-color: #222222;
color: #565656;
text-transform: normal;
padding: 5px;
}
.commentreply {
text-align: justify;
position: relative;
margin: 10px;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 12px;
color: #565656;
}
.commentbox {
padding: 5px;
margin: 10px;
text-align: left;
background-color: #222222;
border: 1px dotted #022d4c;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #30658c;
}
.datesubjectcomment a:hover {
color: #777777;
}
.commentboxpartial {
padding: 10px;
margin: 10px;
background-color: #222222;
}
.commentinfo {
margin-top: 10px;
width: 100%;
}
/*-----------------------
SECTION: Year/Archive Page
-------------------------*/
ul.year {
text-align: center;
padding: 20px 0 20px 0;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border: 1px dotted #022d4c;
color: #555555;
}
table.yeartable td.yearday {
text-align: center;
color: #555555;
}
td.yearmonth {
color: #555555;
border-style: none;
}
/*-----------------------
SECTION: Tags Page
-------------------------*/
ul.ljtaglist {
color: #555555;
font-family: "Trebuchet ms", arial, verdana, sans-serif;
font-size: 10pt;
padding-left: 12px;
padding: 8px;
}
ul.ljtaglist li {
list-style: none;
}
/*-----------------------
SECTION: Tiny Icons
-------------------------*/
.subject img[src=http://stat.livejournal.com/img/icon_protected.gif]{
width: 0;
height: 0;
padding: 12px 9px 0px 0px !important;
background: url();
}
.subject img[src=http://stat.livejournal.com/img/icon_private.gif]{
width: 0;
height: 0;
padding: 9px 9px 0px 0px !important;
background: url();
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
background-image: url();
padding: 12px 7px 0 2px !important;
}
.ljuser img[src=http://stat.livejournal.com/img/userinfo.gif] {
background-color:transparent;
background-image: url();
padding: 12px 7px 0 2px !important;
}
.ljuser img[src=http://stat.livejournal.com/img/community.gif] {
background-color:transparent;
background-image: url();
padding: 11px 11px 0 2px !important;
}
/*-----------------------
SECTION: Mics
-------------------------*/
.clear {
height: 7px;
font-size: 0.01px;
}
#lj_controlstrip td {
font-family: georgia !important;
font-size: 11px;
background-color: #191919 !important;
border: 1px solid #333333;
}
#lj_controlstrip a {
font-family: georgia !important;
font-size: 11px;
color: #666666!important;
text-transform: lowercase;
}
.headerimage {
position: relative;
border-color: #444444;
border-style: dotted;
border-width: 1px 1px 0px 1px;
width: 750px;
height: 300px;
padding-left: 0px;
padding-right: 0x;
padding-bottom: 0px;
padding-top: 0px;
margin-left: auto;
margin-right: auto;
margin-top: 1px;
background-color: #191919;
background-image: url(HEADER IMAGE URL);
background-position: center;
background-repeat: no-repeat;
}
.separator {
height: 20px;
}
Header 750 x 300 made by serenitysangel
Header 750 x 300 made by serenitysangel
Background - insert at top of coding, looks nice behind layout
Fonts Used:
Dirty Ego
Pea Alesa
king cool KC
See the Font Tutorial if you need help adding these fonts to your computer system.
Check out Using Layouts on the sidebar for any extra assistance.
Please direct people to layout_lounge. Please credit serenitysangel for the lovely headers.