10: Air, Peach, Clover

Nov 05, 2008 16:20

Air:



Screenshot | Live Preview

S2 Flexible Squares
Tested in Firefox 3 and IE 7
Works for all account types


/*------------------------------
Air by novaless.lj.com
For S2 Flexible Squares
------------------------------*/

/*------------------------------
General
------------------------------*/

a {
color: #6dbdd1;
text-decoration: none;
}

a:hover {
color: #B0DFEB;
text-decoration: none;
}

blockquote {
padding: 15px;
border: 1px solid #efefef;
}

img {
filter: alpha(opacity=80);
moz-opacity: .80;
opacity: .80;
}

img:hover {
filter: alpha(opacity=100);
moz-opacity: 1;
opacity: 1;
}

/*------------------------------
Body
------------------------------*/

body {
background-color: #fafafa;
text-align: justify;
color: #888;
font-family: arial;
font-size: 11px;
line-height: 18px;
margin: 50px 0 50px 0;
}

.clear {
display: none;
}

#content {
width: 850px;
margin: auto;
}

.separator {
height: 20px;
}

.subcontent {
}

#maincontent {
padding: 30px 30px 10px 260px;
background-color: #fff;
border: 1px solid #efefef;
}

.skiplinks {
border-bottom: 1px solid #efefef;
text-align: center;
padding-bottom: 10px;
margin-bottom: 10px;
color: #fff;
}

/*------------------------------
Header
------------------------------*/

div#header a, div#header a:link, div#header a:visited {
color: #ccc;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
padding: 8px 15px 8px 15px;
background-color: #fff;
margin-right: 5px;
border: 1px solid #efefef;
}

div#header a:hover {
color: #fff;
background-color: #B0DFEB;
border: 1px solid #B0DFEB;
}

#header {
margin: 0 0 25px 0;
font-family: century gothic;
padding-top: 9px;
}

.headerimage {
position: relative;
width: ;
height: ;
margin: auto auto 25px auto;
background-image: url();
background-repeat: no-repeat;
}

li.view {
color: #fff;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
padding: 8px 15px 8px 15px;
background-color: #B0DFEB;
border: 1px solid #B0DFEB;
margin-right: 5px;
}

.subtitle {
display: none;
}

.title {
display: none;
}

ul.navheader {
margin: 0px;
padding: 0px;
text-align: left;
}

ul.navheader li {
display: inline;
list-style-type: none;
}

/*------------------------------
Footer
------------------------------*/

.clearfoot {
display: none;
}

div#footer a, div#footer a:link, div#footer a:visited {
color: #ccc;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
padding: 8px 15px 8px 15px;
background-color: #fff;
margin-right: 5px;
border: 1px solid #efefef;
}

div#footer a:hover {
color: #fff;
background-color: #B0DFEB;
border: 1px solid #B0DFEB;
}

#footer {
text-align: right;
clear: both;
margin: 25px 0 0 0;
font-family: century gothic;
padding-bottom: 9px;
}

li.viewing {
color: #fff;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
padding: 8px 15px 8px 15px;
background-color: #B0DFEB;
border: 1px solid #B0DFEB;
margin-right: 5px;
}

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

ul.navfooter li {
display: inline;
list-style-type: none;
}

/*------------------------------
Entry
------------------------------*/

.comments {
color: #fff;
text-align: right;
margin: 20px 0 0 0;
}

.date {
color: #ccc;
font-size: 11px;
text-transform: uppercase;
margin-bottom: 10px;
}

.datesubject {
margin: 0px;
padding: 0 0 10px 0;
}

div.comments a, div.comments a:link, div.comments a:visited {
text-align: right;
font-size: 12px;
text-transform: uppercase;
color: #888;
border-bottom: 1px dotted #efefef;
padding-bottom: 3px;
}

div.comments a:hover {
color: #B0DFEB;
}

.entry {
min-height: 100px;
}

.entry ol, .entry ul li {
margin-top: 0px;
}

.ljtags {
background: url(http://i37.tinypic.com/11mcmj9.png) no-repeat left center;
padding-left: 18px;
margin-top: 20px;
}

.ljtaglist {
list-style-type: none;
}

.subject {
text-align: left;
font-size: 18px;
color: #B0DFEB;
font-weight: bold;
padding: 0 0 10px 0;
text-transform: uppercase;
font-family: century gothic;
border-bottom: 1px solid #efefef;
margin-right: 112px;
}

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

/*------------------------------
Sidebar
------------------------------*/

.defaultuserpic {
display: none;
text-align: center;
margin-bottom: 20px;
}

.defaultuserpic img {
padding: 5px;
border: 1px solid #eaeaea;
}

li.sbaritem {
list-style-type: none;
margin: 0px;
}

li.sbaritem a {
display: block;
padding: 5px 0 5px 0;
list-style-type: none;
font-size: 12px;
text-transform: uppercase;
color: #888;
border-bottom: 1px dotted #efefef;
}

li.sbaritem a:hover {
color: #B0DFEB;
}

li.sbartitle {
list-style-type: none;
text-align: left;
font-size: 18px;
color: #B0DFEB;
font-weight: bold;
padding: 0 0 10px 0;
text-transform: lowercase;
font-family: century gothic;
border-bottom: 1px solid #efefef;
margin-bottom: 10px;
}

#sidebar_linklist, #sidebar_calendar, #sidebar_tags {
margin-bottom: 20px;
}

.sbarbody2 {
margin-bottom: 20px;
text-align: justify;
}

.calendar {
}

.sbarcalendar {
padding: 6px;
text-align: center;
}

.sbarcalendarposts {
padding: 6px;
border: 1px solid #efefef;
text-align: center;
}

.sbarlist {
margin: 0px;
padding: 0px;
}

.tagcloud, .sbarblank {
list-style-type: none;
}

#sidebar {
float: left;
background-color: #fff;
width: 200px;
border-top: 1px solid #efefef;
border-left: 1px solid #efefef;
padding: 30px 15px 10px 30px;
}

/*------------------------------
Currents
------------------------------*/

.currents {
}

.currentmood {
background: url(http://i34.tinypic.com/6rhgco.png) no-repeat left center;
padding-left: 18px;
}

.currentmusic {
background: url(http://i34.tinypic.com/6rhgco.png) no-repeat left center;
padding-left: 18px;
}

.currentlocation {
display:none;
}

.currents strong {
font-weight: normal;
}

/*------------------------------
Userpics
------------------------------*/

.userpic, .userpicfriends {
position: relative;
float: right;
margin: 0;
text-align: right;
z-index: 15;
color: #fff;
}

.userpic img {
margin: 0 0 9px 10px;
border: 1px solid #ebebeb;
padding: 5px;
}

.userpicfriends img {
margin: 0 0 5px 10px;
border: 1px solid #ebebeb;
padding: 5px;
}

.userpicfriends a font {
color: #6dbdd1;
}

.userpicfriends a:hover font {
color: #B0DFEB;
}

/*------------------------------
Tinyicons
------------------------------*/

.subject img[src="http://p-stat.livejournal.com/img/icon_protected.gif"] {
width: 0;
height: 0;
padding: 16px 18px 0px 0px;
background: url(http://i37.tinypic.com/24641tg.png);
background-repeat: no-repeat;
}

.subject img[src="http://p-stat.livejournal.com/img/icon_private.gif"] {
width: 0;
height: 0;
padding: 16px 18px 0px 0px;
background: url(http://i37.tinypic.com/24641tg.png);
background-repeat: no-repeat;
}

.ljuser img {
width: 0px;
height: 0px;
background-image: url(http://i38.tinypic.com/11j97kg.png);
background-repeat: no-repeat;
padding: 16px 18px 0 0 !important;
}

.ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] {
width: 0px;
height: 0px;
background-image: url(http://i38.tinypic.com/11j97kg.png);
background-repeat: no-repeat;
padding: 16px 19px 0 0 !important;
}

.ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] {
width: 0px;
height: 0px;
background-image: url(http://i34.tinypic.com/348hcpj.png);
background-repeat: no-repeat;
padding: 16px 19px 0 0 !important;
}

/*------------------------------
Contextual Popup
------------------------------*/

div.ContextualPopup {
margin: 5px 0 0 20px;
font: normal 11px arial !important;
}

div.ContextualPopup img {
border: 0;
}

div.ContextualPopup div.Inner {
background-color: #ffffff !important;
color: #888 !important;
border: 1px solid #efefef;
padding: 20px;
width: 20em;
}

div.ContextualPopup .Content {
padding: 2px 4px 6px 4px;
margin-right: 50px;
line-height: 1.4;
}

div.ContextualPopup .Relation {
font-weight: bold !important;
}

div.ContextualPopup .Content .OnlineStatus {
font-weight: normal;
}

div.ContextualPopup .Userpic {
padding: 4px 4px 0 0;
}

div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
text-decoration: underline !important;
font-weight: normal;
color: #6dbdd1 !important;
}

/*------------------------------
Comment Page
------------------------------*/

.box {
width: auto;
}

.commentbox {
background-color: #fff;
border-bottom: 1px solid #efefef;
padding: 0 0 10px 0;
margin-top: 20px;
}

.commentboxpartial {
background-color: #fff;
border-bottom: 1px solid #efefef;
padding: 0 0 10px 0;
margin-top: 20px;
}

.commentreply {
margin-top: 10px;
}

.datesubjectcomment {
padding-bottom: 10px;
border-bottom: 1px dotted #efefef;
}

input, textarea, select {
background-color: #ffffff;
border: 1px solid #efefef;
font-size: 11px;
padding: 3px;
font-family: arial;
color: #888;
}

.reply {
position: relative;
}

.userpiccomment {
position: relative;
z-index: 15;
float: left;
margin: 0 16px 0 0;
border: 1px solid #ebebeb;
padding: 5px;
}

#qrform table {
border: 1px solid #efefef !important;
padding: 20px;
margin: 10px auto 20px auto;
}

Peach:



Screenshot | Live Preview

/*------------------------------
Peach by novaless.lj.com
For S2 Flexible Squares
------------------------------*/

/*------------------------------
General
------------------------------*/

a {
color: #f98d6e;
text-decoration: none;
}

a:hover {
color: #febaa6;
text-decoration: none;
}

blockquote {
padding: 15px;
border: 1px solid #efefef;
}

img {
filter: alpha(opacity=80);
moz-opacity: .80;
opacity: .80;
}

img:hover {
filter: alpha(opacity=100);
moz-opacity: 1;
opacity: 1;
}

/*------------------------------
Body
------------------------------*/

body {
background-color: #fafafa;
text-align: justify;
color: #888;
font-family: arial;
font-size: 11px;
line-height: 18px;
margin: 50px 0 50px 0;
}

.clear {
display: none;
}

#content {
width: 850px;
margin: auto;
}

.separator {
height: 20px;
}

.subcontent {
}

#maincontent {
padding: 30px 30px 10px 260px;
background-color: #fff;
border: 1px solid #efefef;
}

.skiplinks {
border-bottom: 1px solid #efefef;
text-align: center;
padding-bottom: 10px;
margin-bottom: 10px;
color: #fff;
}

/*------------------------------
Header
------------------------------*/

div#header a, div#header a:link, div#header a:visited {
color: #ccc;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
padding: 8px 15px 8px 15px;
background-color: #fff;
margin-right: 5px;
border: 1px solid #efefef;
}

div#header a:hover {
color: #fff;
background-color: #febaa6;
border: 1px solid #febaa6;
}

#header {
margin: 0 0 25px 0;
font-family: century gothic;
padding-top: 9px;
}

.headerimage {
position: relative;
width: ;
height: ;
margin: auto auto 25px auto;
background-image: url();
background-repeat: no-repeat;
}

li.view {
color: #fff;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
padding: 8px 15px 8px 15px;
background-color: #febaa6;
border: 1px solid #febaa6;
margin-right: 5px;
}

.subtitle {
display: none;
}

.title {
display: none;
}

ul.navheader {
margin: 0px;
padding: 0px;
text-align: left;
}

ul.navheader li {
display: inline;
list-style-type: none;
}

/*------------------------------
Footer
------------------------------*/

.clearfoot {
display: none;
}

div#footer a, div#footer a:link, div#footer a:visited {
color: #ccc;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
padding: 8px 15px 8px 15px;
background-color: #fff;
margin-right: 5px;
border: 1px solid #efefef;
}

div#footer a:hover {
color: #fff;
background-color: #febaa6;
border: 1px solid #febaa6;
}

#footer {
text-align: right;
clear: both;
margin: 25px 0 0 0;
font-family: century gothic;
padding-bottom: 9px;
}

li.viewing {
color: #fff;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
padding: 8px 15px 8px 15px;
background-color: #febaa6;
border: 1px solid #febaa6;
margin-right: 5px;
}

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

ul.navfooter li {
display: inline;
list-style-type: none;
}

/*------------------------------
Entry
------------------------------*/

.comments {
color: #fff;
text-align: right;
margin: 20px 0 0 0;
}

.date {
color: #ccc;
font-size: 11px;
text-transform: uppercase;
margin-bottom: 10px;
}

.datesubject {
margin: 0px;
padding: 0 0 10px 0;
}

div.comments a, div.comments a:link, div.comments a:visited {
text-align: right;
font-size: 12px;
text-transform: uppercase;
color: #888;
border-bottom: 1px dotted #efefef;
padding-bottom: 3px;
}

div.comments a:hover {
color: #febaa6;
}

.entry {
min-height: 100px;
}

.entry ol, .entry ul li {
margin-top: 0px;
}

.ljtags {
background: url(http://i33.tinypic.com/65n7t4.png) no-repeat left center;
padding-left: 18px;
margin-top: 20px;
}

.ljtaglist {
list-style-type: none;
}

.subject {
text-align: left;
font-size: 18px;
color: #febaa6;
font-weight: bold;
padding: 0 0 10px 0;
text-transform: uppercase;
font-family: century gothic;
border-bottom: 1px solid #efefef;
margin-right: 112px;
}

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

/*------------------------------
Sidebar
------------------------------*/

.defaultuserpic {
display: none;
}

li.sbaritem {
list-style-type: none;
margin: 0px;
}

li.sbaritem a {
display: block;
padding: 5px 0 5px 0;
list-style-type: none;
font-size: 12px;
text-transform: uppercase;
color: #888;
border-bottom: 1px dotted #efefef;
}

li.sbaritem a:hover {
color: #febaa6;
}

li.sbartitle {
list-style-type: none;
text-align: left;
font-size: 18px;
color: #febaa6;
font-weight: bold;
padding: 0 0 10px 0;
text-transform: lowercase;
font-family: century gothic;
border-bottom: 1px solid #efefef;
margin-bottom: 10px;
}

#sidebar_linklist, #sidebar_calendar, #sidebar_tags {
margin-bottom: 20px;
}

.sbarbody2 {
margin-bottom: 20px;
text-align: justify;
}

.calendar {
}

.sbarcalendar {
padding: 6px;
text-align: center;
}

.sbarcalendarposts {
padding: 6px;
border: 1px solid #efefef;
text-align: center;
}

.sbarlist {
margin: 0px;
padding: 0px;
}

.tagcloud, .sbarblank {
list-style-type: none;
}

#sidebar {
float: left;
background-color: #fff;
width: 200px;
border-top: 1px solid #efefef;
border-left: 1px solid #efefef;
padding: 30px 15px 10px 30px;
}

/*------------------------------
Currents
------------------------------*/

.currents {
}

.currentmood {
background: url(http://i34.tinypic.com/6rhgco.png) no-repeat left center;
padding-left: 18px;
}

.currentmusic {
background: url(http://i34.tinypic.com/6rhgco.png) no-repeat left center;
padding-left: 18px;
}

.currentlocation {
display:none;
}

.currents strong {
font-weight: normal;
}

/*------------------------------
Userpics
------------------------------*/

.userpic, .userpicfriends {
position: relative;
float: right;
margin: 0;
text-align: right;
z-index: 15;
color: #fff;
}

.userpic img {
margin: 0 0 9px 10px;
border: 1px solid #ebebeb;
padding: 5px;
}

.userpicfriends img {
margin: 0 0 5px 10px;
border: 1px solid #ebebeb;
padding: 5px;
}

.userpicfriends a font {
color: #f98d6e;
}

.userpicfriends a:hover font {
color: #febaa6;
}

/*------------------------------
Tinyicons
------------------------------*/

.subject img[src="http://p-stat.livejournal.com/img/icon_protected.gif"] {
width: 0;
height: 0;
padding: 16px 18px 0px 0px;
background: url(http://i37.tinypic.com/24641tg.png);
background-repeat: no-repeat;
}

.subject img[src="http://p-stat.livejournal.com/img/icon_private.gif"] {
width: 0;
height: 0;
padding: 16px 18px 0px 0px;
background: url(http://i37.tinypic.com/24641tg.png);
background-repeat: no-repeat;
}

.ljuser img {
width: 0px;
height: 0px;
background-image: url(http://i38.tinypic.com/11j97kg.png);
background-repeat: no-repeat;
padding: 16px 18px 0 0 !important;
}

.ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] {
width: 0px;
height: 0px;
background-image: url(http://i38.tinypic.com/11j97kg.png);
background-repeat: no-repeat;
padding: 16px 19px 0 0 !important;
}

.ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] {
width: 0px;
height: 0px;
background-image: url(http://i34.tinypic.com/348hcpj.png);
background-repeat: no-repeat;
padding: 16px 19px 0 0 !important;
}

/*------------------------------
Contextual Popup
------------------------------*/

div.ContextualPopup {
margin: 5px 0 0 20px;
font: normal 11px arial !important;
}

div.ContextualPopup img {
border: 0;
}

div.ContextualPopup div.Inner {
background-color: #ffffff !important;
color: #888 !important;
border: 1px solid #efefef;
padding: 20px;
width: 20em;
}

div.ContextualPopup .Content {
padding: 2px 4px 6px 4px;
margin-right: 50px;
line-height: 1.4;
}

div.ContextualPopup .Relation {
font-weight: bold !important;
}

div.ContextualPopup .Content .OnlineStatus {
font-weight: normal;
}

div.ContextualPopup .Userpic {
padding: 4px 4px 0 0;
}

div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
text-decoration: underline !important;
font-weight: normal;
color: #f98d6e !important;
}

/*------------------------------
Comment Page
------------------------------*/

.box {
width: auto;
}

.commentbox {
background-color: #fff;
border-bottom: 1px solid #efefef;
padding: 0 0 10px 0;
margin-top: 20px;
}

.commentboxpartial {
background-color: #fff;
border-bottom: 1px solid #efefef;
padding: 0 0 10px 0;
margin-top: 20px;
}

.commentreply {
margin-top: 10px;
}

.datesubjectcomment {
padding-bottom: 10px;
border-bottom: 1px dotted #efefef;
}

input, textarea, select {
background-color: #ffffff;
border: 1px solid #efefef;
font-size: 11px;
padding: 3px;
font-family: arial;
color: #888;
}

.reply {
position: relative;
}

.userpiccomment {
position: relative;
z-index: 15;
float: left;
margin: 0 16px 0 0;
border: 1px solid #ebebeb;
padding: 5px;
}

#qrform table {
border: 1px solid #efefef !important;
padding: 20px;
margin: 10px auto 20px auto;
}

Clover:



Screenshot | Live Preview

/*------------------------------
Clover by novaless.lj.com
For S2 Flexible Squares
------------------------------*/

/*------------------------------
General
------------------------------*/

a {
color: #9ec843;
text-decoration: none;
}

a:hover {
color: #c3e47d;
text-decoration: none;
}

blockquote {
padding: 15px;
border: 1px solid #efefef;
}

img {
filter: alpha(opacity=80);
moz-opacity: .80;
opacity: .80;
}

img:hover {
filter: alpha(opacity=100);
moz-opacity: 1;
opacity: 1;
}

/*------------------------------
Body
------------------------------*/

body {
background-color: #fafafa;
text-align: justify;
color: #888;
font-family: arial;
font-size: 11px;
line-height: 18px;
margin: 50px 0 50px 0;
}

.clear {
display: none;
}

#content {
width: 850px;
margin: auto;
}

.separator {
height: 20px;
}

.subcontent {
}

#maincontent {
padding: 30px 30px 10px 260px;
background-color: #fff;
border: 1px solid #efefef;
}

.skiplinks {
border-bottom: 1px solid #efefef;
text-align: center;
padding-bottom: 10px;
margin-bottom: 10px;
color: #fff;
}

/*------------------------------
Header
------------------------------*/

div#header a, div#header a:link, div#header a:visited {
color: #ccc;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
padding: 8px 15px 8px 15px;
background-color: #fff;
margin-right: 5px;
border: 1px solid #efefef;
}

div#header a:hover {
color: #fff;
background-color: #c3e47d;
border: 1px solid #c3e47d;
}

#header {
margin: 0 0 25px 0;
font-family: century gothic;
padding-top: 9px;
}

.headerimage {
position: relative;
width: ;
height: ;
margin: auto auto 25px auto;
background-image: url();
background-repeat: no-repeat;
}

li.view {
color: #fff;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
padding: 8px 15px 8px 15px;
background-color: #c3e47d;
border: 1px solid #c3e47d;
margin-right: 5px;
}

.subtitle {
display: none;
}

.title {
display: none;
}

ul.navheader {
margin: 0px;
padding: 0px;
text-align: left;
}

ul.navheader li {
display: inline;
list-style-type: none;
}

/*------------------------------

Footer
------------------------------*/

.clearfoot {
display: none;
}

div#footer a, div#footer a:link, div#footer a:visited {
color: #ccc;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
padding: 8px 15px 8px 15px;
background-color: #fff;
margin-right: 5px;
border: 1px solid #efefef
}

div#footer a:hover {
color: #fff;
background-color: #c3e47d;
border: 1px solid #c3e47d;
}

#footer {
text-align: right;
clear: both;
margin: 25px 0 0 0;
font-family: century gothic;
padding-bottom: 9px;
}

li.viewing {
color: #fff;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
padding: 8px 15px 8px 15px;
background-color: #c3e47d;
}

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

ul.navfooter li {
display: inline;
list-style-type: none;
}

/*------------------------------
Entry
------------------------------*/

.comments {
color: #fff;
text-align: right;
margin: 20px 0 0 0;
}

.date {
color: #ccc;
font-size: 11px;
text-transform: uppercase;
margin-bottom: 10px;
}

.datesubject {
margin: 0px;
padding: 0 0 10px 0;
}

div.comments a, div.comments a:link, div.comments a:visited {
text-align: right;
font-size: 12px;
text-transform: uppercase;
color: #888;
border-bottom: 1px dotted #efefef;
padding-bottom: 3px;
}

div.comments a:hover {
color: #c3e47d;
}

.entry {
min-height: 100px;
}

.entry ol, .entry ul li {
margin-top: 0px;
}

.ljtags {
background: url(http://i34.tinypic.com/34tabzp.png) no-repeat left center;
padding-left: 18px;
margin-top: 20px;
}

.ljtaglist {
list-style-type: none;
}

.subject {
text-align: left;
font-size: 18px;
color: #c3e47d;
font-weight: bold;
padding: 0 0 10px 0;
text-transform: uppercase;
font-family: century gothic;
border-bottom: 1px solid #efefef;
margin-right: 112px;
}

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

/*------------------------------
Sidebar
------------------------------*/

.defaultuserpic {
display: none;
}

li.sbaritem {
list-style-type: none;
margin: 0px;
}

li.sbaritem a {
display: block;
padding: 5px 0 5px 0;
list-style-type: none;
font-size: 12px;
text-transform: uppercase;
color: #888;
border-bottom: 1px dotted #efefef;
}

li.sbaritem a:hover {
color: #c3e47d;
}

li.sbartitle {
list-style-type: none;
text-align: left;
font-size: 18px;
color: #c3e47d;
font-weight: bold;
padding: 0 0 10px 0;
text-transform: lowercase;
font-family: century gothic;
border-bottom: 1px solid #efefef;
margin-bottom: 10px;
}

#sidebar_linklist, #sidebar_calendar, #sidebar_tags {
margin-bottom: 20px;
}

.sbarbody2 {
margin-bottom: 20px;
text-align: justify;
}

.calendar {
}

.sbarcalendar {
padding: 6px;
text-align: center;
}

.sbarcalendarposts {
padding: 6px;
border: 1px solid #efefef;
text-align: center;
}

.sbarlist {
margin: 0px;
padding: 0px;
}

.tagcloud, .sbarblank {
list-style-type: none;
}

#sidebar {
float: left;
background-color: #fff;
width: 200px;
border-top: 1px solid #efefef;
border-left: 1px solid #efefef;
padding: 30px 15px 10px 30px;
}

/*------------------------------
Currents
------------------------------*/

.currents {
}

.currentmood {
background: url(http://i34.tinypic.com/6rhgco.png) no-repeat left center;
padding-left: 18px;
}

.currentmusic {
background: url(http://i34.tinypic.com/6rhgco.png) no-repeat left center;
padding-left: 18px;
}

.currentlocation {
display:none;
}

.currents strong {
font-weight: normal;
}

/*------------------------------
Userpics
------------------------------*/

.userpic, .userpicfriends {
position: relative;
float: right;
margin: 0;
text-align: right;
z-index: 15;
color: #fff;
}

.userpic img {
margin: 0 0 9px 10px;
border: 1px solid #ebebeb;
padding: 5px;
}

.userpicfriends img {
margin: 0 0 5px 10px;
border: 1px solid #ebebeb;
padding: 5px;
}

.userpicfriends a font {
color: #9ec843;
}

.userpicfriends a:hover font {
color: #c3e47d;
}

/*------------------------------
Tinyicons
------------------------------*/

.subject img[src="http://p-stat.livejournal.com/img/icon_protected.gif"] {
width: 0;
height: 0;
padding: 16px 18px 0px 0px;
background: url(http://i37.tinypic.com/24641tg.png);
background-repeat: no-repeat;
}

.subject img[src="http://p-stat.livejournal.com/img/icon_private.gif"] {
width: 0;
height: 0;
padding: 16px 18px 0px 0px;
background: url(http://i37.tinypic.com/24641tg.png);
background-repeat: no-repeat;
}

.ljuser img {
width: 0px;
height: 0px;
background-image: url(http://i38.tinypic.com/11j97kg.png);
background-repeat: no-repeat;
padding: 16px 18px 0 0 !important;
}

.ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] {
width: 0px;
height: 0px;
background-image: url(http://i38.tinypic.com/11j97kg.png);
background-repeat: no-repeat;
padding: 16px 19px 0 0 !important;
}

.ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] {
width: 0px;
height: 0px;
background-image: url(http://i34.tinypic.com/348hcpj.png);
background-repeat: no-repeat;
padding: 16px 19px 0 0 !important;
}

/*------------------------------
Contextual Popup
------------------------------*/

div.ContextualPopup {
margin: 5px 0 0 20px;
font: normal 11px arial !important;
}

div.ContextualPopup img {
border: 0;
}

div.ContextualPopup div.Inner {
background-color: #ffffff !important;
color: #888 !important;
border: 1px solid #efefef;
padding: 20px;
width: 20em;
}

div.ContextualPopup .Content {
padding: 2px 4px 6px 4px;
margin-right: 50px;
line-height: 1.4;
}

div.ContextualPopup .Relation {
font-weight: bold !important;
}

div.ContextualPopup .Content .OnlineStatus {
font-weight: normal;
}

div.ContextualPopup .Userpic {
padding: 4px 4px 0 0;
}

div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
text-decoration: underline !important;
font-weight: normal;
color: #9ec843 !important;
}

/*------------------------------
Comment Page
------------------------------*/

.box {
width: auto;
}

.commentbox {
background-color: #fff;
border-bottom: 1px solid #efefef;
padding: 0 0 10px 0;
margin-top: 20px;
}

.commentboxpartial {
background-color: #fff;
border-bottom: 1px solid #efefef;
padding: 0 0 10px 0;
margin-top: 20px;
}

.commentreply {
margin-top: 10px;
}

.datesubjectcomment {
padding-bottom: 10px;
border-bottom: 1px dotted #efefef;
}

input, textarea, select {
background-color: #ffffff;
border: 1px solid #efefef;
font-size: 11px;
padding: 3px;
font-family: arial;
color: #888;
}

.reply {
position: relative;
}

.userpiccomment {
position: relative;
z-index: 15;
float: left;
margin: 0 16px 0 0;
border: 1px solid #ebebeb;
padding: 5px;
}

#qrform table {
border: 1px solid #efefef !important;
padding: 20px;
margin: 10px auto 20px auto;
}

Last edited on Dec 21, 2008.

Installation:
  1. Choose "Flexible Squares" as your theme.
  2. Click on "Customize Your Theme" and go to the "Custom CSS" section.
  3. Select "no" in all three drop-down menus, and insert the code into the custom stylesheet box.
  4. Header images can be added into .headerimage. Be sure to fix the height and width according to your image.

Enjoy! :D Please credit novaless if using; thank you.

flexible squares, !layouts

Previous post Next post
Up