#03: turquoise.
Something new ;)
WITHOUT SIDEBAR.
live
WITH SIDEBAR.
live
Instructions
1) Click here in order to customize your layout.
2) Type in the search box 'Flexible Squares' and apply and apply either "Blue Grey" or "Black and White and Red All Over".
3) Go to Custom CSS. Set everything to No.
4) Paste in the 'Custom Stylesheet' box the following code.
Code
Without Sidebar:
/* CSS by loosegraphics @ arcticdesign.livejournal.com DO NOT REMOVE THIS SECTION. find .headerimage for your personal header */
body {
background-color: #9de6f7;
text-align: center;
color: #636869;
font-family: "Century Gothic", Georgia, sans-serif;
font-size: 12px;
margin: 20px 0 20px 0;
}
a, a:link, a:visited {
color: #9de6f7;
text-decoration: none;
}
a:hover {
color: #9de6f7;
text-decoration: none;
border-bottom:1px dotted #9de6f7;
cursor:help;
}
p, td, blockquote {
font-size: 11px;
}
blockquote {
border:1px solid #d6d4d4;
padding:7px;
margin-top:20px;
font-family:Century Gothic;
}
code, kbd, pre, tt {
font-family: monospace;
}
#content
{
width: 60%;
padding: 15px;
position: absolute;
right:2%;
margin: 30% 0 0 0;
}
#maincontent {
margin-top: 15px;
font-family: "Century Gothic", sans-serif;
font-size: 12px;
text-align: left;
}
#header {
width: 100%;
padding: 10px 0px 20px 0px;
margin: 0px;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: bold;
letter-spacing: 2px;
color: #000000;
}
.headerimage {
background-image:url(http://i32.tinypic.com/516hwy.png);
background-repeat:no-repeat;
height:172px;
width:663px;
position:absolute;
right:7%;
margin: 15% 0 0 0;
}
div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
color: #86c1cf;
}
div#header a, div#header li.view {
padding:15px 50px;
height:60px;
width:115px;
background-image: url(http://i29.tinypic.com/2wn06rp.png);
background-repeat: no-repeat;
background-position: center;
font-family:Century Gothic;
font-size:20px;
letter-spacing:-2px;
text-transform:lowercase;
font-weight:normal;
}
div#header a:active, div#header a:hover {
background-image: url(http://i30.tinypic.com/2qlwmdd.png);
background-repeat: no-repeat;
background-position: center;
}
div#footer a, div#footer a:link, div#footer a:visited {
color:#FFFFFF;
font-size:23px;
}
div#footer a:hover {
text-decoration:none;
border-bottom:1px #ffffff dotted;
}
.title {
font-family: Georgia;
font-size: 48px;
letter-spacing:-3px;
font-weight: normal;
line-height: 200%;
top: 10px;
}
.subtitle{
font-family: "Lucida Sans Unicode", sans-serif;
font-size: 18px;
text-transform: uppercase;
font-weight: normal;
top: 10px;
margin-top:-10px;
}
ul.navheader
{
padding: 0px;
margin: 0px;
margin-bottom:25px;
}
ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}
.subcontent {
background-color:#ececec;
border:1px solid #86c1cf;
}
.entry {
margin: 0px 10px 10px 30px;
padding: 10px;
background-color: #ececec;
color: #636869;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
}
.entry a {
font-weight:bold;
}
.userpic {
position: absolute;
left:-20%;
padding: 13px;
margin: 10px;
margin-top:-1px;
text-align: center;
background-color:#ececec !important;
border: 1px solid #86c1cf;
z-index: 25;
}
.userpic a {
display:none;
}
.date {
top: 5px;
line-height: 200%;
color: #000000;
font-family: "Trebuchet ;S", sans-serif;
font-size: 10px;
letter-spacing:3px;
opacity:0.7;
}
.subject {
padding: 10px;
padding-top:0;
color: #636869;
font-family: "Century Gothic", sans-serif;
text-transform: uppercase;
font-size: 14px;
letter-spacing:-1px;
}
.subject a, .subject a:link, .subject a:visited {
color: #636869;
}
.subject a:hover {
text-decoration:none;
border-bottom:1px dotted;
}
.datesubject {
background-color: #ececec;
padding: 5px;
text-align:center;
}
.entry ul li, .entry ol li
{
padding-left: 5px;
margin-left: 15px;
}
.currents, .currentmood, .currentmusic {
font-family: "Century Gothic", sans-serif;
font-size: 14px;
text-transform:lowercase;
letter-spacing:-1px;
}
.currents strong {
display:none;
}
.currents a {
font-weight:normal !important;
}
.comments {
font-family: "Century Gothic", sans-serif;
font-size: 14px;
text-align: right;
padding: 0px 5px 0px 5px;
position: relative;
top: 15px;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #636869;
font-weight:normal !important;
}
div.comments a:hover {
cursor:help;
text-decoration: none;
}
.separator {
height: 35px;
}
.userpicfriends {
position: absolute;
left:-20%;
padding: 13px;
margin: 10px;
margin-top:-1px;
text-align: center;
background-color:#ececec !important;
border: 1px solid #86c1cf;
z-index: 25;
}
.userpicfriends a {
font-family:Century Gothic;
font-size:12px;
letter-spacing:-1px;
color:#9de6f7;
font-weight:bold;
}
.userpicfriends img {
margin: 0 0 5px 0;
}
#userpics a {
color:#000;
}
.defaultuserpic {
text-align: center;
}
.defaultuserpic img {
margin-top:8px;
border:10px solid #ffffff;
background:#ffffff;
}
.defaultuserpic a:hover {
border:none !important;
}
#sidebar {
display:none;
}
#footer {
width: 100%;
text-align: center;
font-family: "Century Gothic", sans-serif;
font-size: 23px;
letter-spacing: -1px;
color: #FFFFFF;
z-index: 100;
clear: both;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
ul.year {
text-align: center;
padding-bottom: 20px;
font-family:Georgia;
font-size:30px;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border:1px solid #86c1cf;
font-family: Century Gothic;
}
table.yeartable td.yearday {
background-color: #ececec;
text-align: center;
}
table.yeartable td.yeardate a {
color:#ffffff !important;
font-size:13px;
}
td.yearmonth {
border-style: none;
}
.datesubjectcomment {
padding: 5px;
margin-top: 20px;
}
.userpiccomment {
position: absolute;
left:-20%;
padding: 13px;
margin: 10px;
margin-top:-1px;
text-align: center;
background-color:#ececec !important;
border:1px solid #86c1cf;
z-index: 25;
}
.box {
border-style: solid;
border-width: 1px 0px 0px 0px;
border-color: #999999;
padding: 10px;
clear: left;
}
.box center a {
color:#ffffff;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
}
.box a {
font-weight:bold;
}
.box b {
color:#ffffff;
}
input {
background-color: #d4dce8;
color: #000000;
}
input.textbox#subject {
background-color:#ffffff;
font-family:Century Gothic;
}
textarea.textbox {
width: 100% !important;
}
textarea.textbox#commenttext {
font-family:Century Gothic;
font-size:14px;
letter-spacing:-1px;
}
.entry textarea {
margin-left:40%;
margin-top:20px;
font-family:Century Gothic;
background-color:#f9f9f9;
opacity:0.7;
font-size:10px;
text-transform:lowercase;
}
.entry textarea:hover {
opacity:1.0;
}
.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: #d4dce8;
color: #000000;
}
.replytosubject {
font-weight: bold;
}
.commentreply {
position: relative;
margin: 10px;
color: #636869;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
}
.commentbox {
border: #86c1cf 1px solid;
padding: 10px;
margin: 10px;
background-color: #ececec;
}
.datesubjectcomment {
color:#000;
font-family:Century Gothic;
font-size:13px;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #9de6f7;
font-family:Century Gothic;
font-size:13px;
}
.datesubjectcomment a:hover {
color: #b0b9c8;
}
.commentboxpartial {
border-color: #999999;
border-width: 1px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: #d4dce8;
}
.commentinfo {
background-color: #d4dce8;
margin-top: 10px;
width: 100%;
}
.skiplinks, .skiplinks a {
text-align: center;
color:#fff;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
text-transform:lowercase;
}
.skiplinks a:hover {
border-bottom:1px #ffffff dotted;
}
ul.ljtaglist a {
font-size:13px;
color:#ffffff;
font-weight:bold;
}
ul.ljtaglist a:hover {
text-decoration:none;
border-bottom:1px dotted #ffffff;
}
ul.ljtaglist li {
list-style-image:url(http://i29.tinypic.com/29ftvl5.png);
}
.ljtags {
color:#ececec;
margin-top:15px;
text-align:center;
}
.ljtags a {
font-weight:bold;
}
.clear {
height: 15px;
}
.ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] {
background-color:transparent;
background-image: url(http://i39.tinypic.com/dokufs.png)!important;
background-repeat: no-repeat!important;
padding:5px;
}
.ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] {
background-color:transparent;
background-image: url(http://i42.tinypic.com/mc50du.png)!important;
background-repeat: no-repeat!important;
padding:5px;
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color: transparent;
padding:13px 13px 4px 5px !important;
}
img[src="http://l-stat.livejournal.com/img/btn_del.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i44.tinypic.com/14d0wmw.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_edit.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i40.tinypic.com/1r2b14.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_scr.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i44.tinypic.com/245ilb7.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_unscr.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i39.tinypic.com/zl96b9.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_track.gif"], img[src="http://l-stat.livejournal.com/img/btn_tracking.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i44.tinypic.com/257najq.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_freeze.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i39.tinypic.com/ydzwh.jpg);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_unfreeze.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i42.tinypic.com/fmthmp.png);
width: 0px;
height: 0px;
}
div.ContextualPopup div.Inner {
background:transparent!important;
color: #9de6f7!important;
border:none;
padding:10px;
width: 250px;
font-family: "Century Gothic", sans-serif;
font-size: 12px;
text-align:justify;
}
div.ContextualPopup .Content {
padding:7px 10px 7px 10px;
margin-right:80px;
line-height: 1.4;
background-color:#ececec;
border:1px solid #9de6f7;
}
div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited {
text-decoration:none !important;
color:#FFF !important;
font-weight:normal !important;
}
div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
text-decoration: none !important;
font-weight: normal;
color: #f07c00 !important;
}
div.ContextualPopup .Relation {
letter-spacing:1px;
border-bottom: 1px dotted #FFF;
margin-bottom:4px;
padding-bottom:4px;
}
With Sidebar:
/* CSS by loosegraphics @ arcticdesign.livejournal.com DO NOT REMOVE THIS SECTION. find .headerimage for your personal header */
body {
background-color: #9de6f7;
text-align: center;
color: #636869;
font-family: "Century Gothic", Georgia, sans-serif;
font-size: 12px;
margin: 20px 0 20px 0;
}
a, a:link, a:visited {
color: #9de6f7;
text-decoration: none;
}
a:hover {
color: #9de6f7;
text-decoration: none;
border-bottom:1px dotted #9de6f7;
cursor:help;
}
p, td, blockquote {
font-size: 11px;
}
blockquote {
border:1px solid #d6d4d4;
padding:7px;
margin-top:20px;
font-family:Century Gothic;
}
code, kbd, pre, tt {
font-family: monospace;
}
#content
{
width: 60%;
padding: 15px;
position: absolute;
right:2%;
margin: 30% 0 0 0;
}
#maincontent {
margin-top: 15px;
font-family: "Century Gothic", sans-serif;
font-size: 12px;
text-align: left;
}
#sidebar {
position:absolute;
left:-60%;
top:12%;
background-color: #ececec;
border: 1px solid #86c1cf;
font-size: 11px;
font-family: "Century Gothic", sans-serif;
color: #000000;
width: 24%;
z-index:200 !important;
}
#header {
width: 100%;
padding: 10px 0px 20px 0px;
margin: 0px;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: bold;
letter-spacing: 2px;
color: #000000;
}
.headerimage {
background-image:url(http://i32.tinypic.com/516hwy.png);
background-repeat:no-repeat;
height:172px;
width:663px;
position:absolute;
right:7%;
margin: 15% 0 0 0;
}
div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
color: #86c1cf;
}
div#header a, div#header li.view {
padding:15px 50px;
height:60px;
width:115px;
background-image: url(http://i29.tinypic.com/2wn06rp.png);
background-repeat: no-repeat;
background-position: center;
font-family:Century Gothic;
font-size:20px;
letter-spacing:-2px;
text-transform:lowercase;
font-weight:normal;
}
div#header a:active, div#header a:hover {
background-image: url(http://i30.tinypic.com/2qlwmdd.png);
background-repeat: no-repeat;
background-position: center;
}
div#footer a, div#footer a:link, div#footer a:visited {
color:#FFFFFF;
font-size:23px;
}
div#footer a:hover {
text-decoration:none;
border-bottom:1px #ffffff dotted;
}
.title {
font-family: Georgia;
font-size: 48px;
letter-spacing:-3px;
font-weight: normal;
line-height: 200%;
top: 10px;
}
.subtitle{
font-family: "Lucida Sans Unicode", sans-serif;
font-size: 18px;
text-transform: uppercase;
font-weight: normal;
top: 10px;
margin-top:-10px;
}
ul.navheader
{
padding: 0px;
margin: 0px;
margin-bottom:25px;
}
ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}
.subcontent {
background-color:#ececec;
border:1px solid #86c1cf;
}
.entry {
margin: 0px 10px 10px 30px;
padding: 10px;
background-color: #ececec;
color: #636869;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
}
.entry a {
font-weight:bold;
}
.userpic {
position: absolute;
left:-20%;
padding: 13px;
margin: 10px;
margin-top:-1px;
text-align: center;
background-color:#ececec !important;
border: 1px solid #86c1cf;
z-index: 25;
}
.userpic a {
display:none;
}
.date {
top: 5px;
line-height: 200%;
color: #000000;
font-family: "Trebuchet ;S", sans-serif;
font-size: 10px;
letter-spacing:3px;
opacity:0.7;
}
.subject {
padding: 10px;
padding-top:0;
color: #636869;
font-family: "Century Gothic", sans-serif;
text-transform: uppercase;
font-size: 14px;
letter-spacing:-1px;
}
.subject a, .subject a:link, .subject a:visited {
color: #636869;
}
.subject a:hover {
text-decoration:none;
border-bottom:1px dotted;
}
.datesubject {
background-color: #ececec;
padding: 5px;
text-align:center;
}
.entry ul li, .entry ol li
{
padding-left: 5px;
margin-left: 15px;
}
.currents, .currentmood, .currentmusic {
font-family: "Century Gothic", sans-serif;
font-size: 14px;
text-transform:lowercase;
letter-spacing:-1px;
}
.currents strong {
display:none;
}
.currents a {
font-weight:normal !important;
}
.comments {
font-family: "Century Gothic", sans-serif;
font-size: 14px;
text-align: right;
padding: 0px 5px 0px 5px;
position: relative;
top: 15px;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #636869;
font-weight:normal !important;
}
div.comments a:hover {
cursor:help;
text-decoration: none;
}
.separator {
height: 35px;
}
.userpicfriends {
position: absolute;
left:-20%;
padding: 13px;
margin: 10px;
margin-top:-1px;
text-align: center;
background-color:#ececec !important;
border: 1px solid #86c1cf;
z-index: 25;
}
.userpicfriends a {
font-family:Century Gothic;
font-size:12px;
letter-spacing:-1px;
color:#9de6f7;
font-weight:bold;
}
.userpicfriends img {
margin: 0 0 5px 0;
}
#userpics a {
color:#000;
}
.defaultuserpic {
text-align: center;
}
.defaultuserpic img {
margin-top:8px;
border:10px solid #ffffff;
background:#ffffff;
}
.defaultuserpic a:hover {
border:none !important;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px 5px 0px 5px;
}
.sbarbody2 {
padding: 0 15px 0 15px;
margin-left:20px;
color: #636869;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
text-align:center;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #9de6f7;
}
div#sidebar a:hover {
border-bottom:1px dotted #9de6f7;
text-decoration: none;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
text-align: center;
font-family: "Century Gothic", sans-serif;
font-size: 11px;
}
.sbarcalendarposts {
border: 1px #86c1cf solid;
background-color: #9de6f7;
text-align: center;
font-family: "Century Gothic", sans-serif;
font-size: 11px;
}
.sbarcalendarposts a {
color:#FFFFFF !important;
}
ul.sbarlist
{
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbaritem
{
padding-left: 15px;
list-style: none;
font-weight:bold;
text-transform:uppercase;
}
li.sbartitle
{
padding-left: 15px;
list-style: none;
font-family:Century Gothic;
text-transform:lowercase;
font-size:15px;
font-weight:bold;
color:#ffffff;
border-bottom:1px #ffffff dotted;
letter-spacing:-1px;
margin-bottom: 10px;
margin-top: 10px;
}
#footer {
width: 100%;
text-align: center;
font-family: "Century Gothic", sans-serif;
font-size: 23px;
letter-spacing: -1px;
color: #FFFFFF;
z-index: 100;
clear: both;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
ul.year {
text-align: center;
padding-bottom: 20px;
font-family:Georgia;
font-size:30px;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border:1px solid #86c1cf;
font-family: Century Gothic;
}
table.yeartable td.yearday {
background-color: #ececec;
text-align: center;
}
table.yeartable td.yeardate a {
color:#ffffff !important;
font-size:13px;
}
td.yearmonth {
border-style: none;
}
.datesubjectcomment {
padding: 5px;
margin-top: 20px;
}
.userpiccomment {
position: absolute;
left:-20%;
padding: 13px;
margin: 10px;
margin-top:-1px;
text-align: center;
background-color:#ececec !important;
border:1px solid #86c1cf;
z-index: 25;
}
.box {
border-style: solid;
border-width: 1px 0px 0px 0px;
border-color: #999999;
padding: 10px;
clear: left;
}
.box center a {
color:#ffffff;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
}
.box a {
font-weight:bold;
}
.box b {
color:#ffffff;
}
input {
background-color: #d4dce8;
color: #000000;
}
input.textbox#subject {
background-color:#ffffff;
font-family:Century Gothic;
}
textarea.textbox {
width: 100% !important;
}
textarea.textbox#commenttext {
font-family:Century Gothic;
font-size:14px;
letter-spacing:-1px;
}
.entry textarea {
margin-left:40%;
margin-top:20px;
font-family:Century Gothic;
background-color:#f9f9f9;
opacity:0.7;
font-size:10px;
text-transform:lowercase;
}
.entry textarea:hover {
opacity:1.0;
}
.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: #d4dce8;
color: #000000;
}
.replytosubject {
font-weight: bold;
}
.commentreply {
position: relative;
margin: 10px;
color: #636869;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
}
.commentbox {
border: #86c1cf 1px solid;
padding: 10px;
margin: 10px;
background-color: #ececec;
}
.datesubjectcomment {
color:#000;
font-family:Century Gothic;
font-size:13px;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #9de6f7;
font-family:Century Gothic;
font-size:13px;
}
.datesubjectcomment a:hover {
color: #b0b9c8;
}
.commentboxpartial {
border-color: #999999;
border-width: 1px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: #d4dce8;
}
.commentinfo {
background-color: #d4dce8;
margin-top: 10px;
width: 100%;
}
.skiplinks, .skiplinks a {
text-align: center;
color:#fff;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
text-transform:lowercase;
}
.skiplinks a:hover {
border-bottom:1px #ffffff dotted;
}
ul.ljtaglist a {
font-size:13px;
color:#ffffff;
font-weight:bold;
}
ul.ljtaglist a:hover {
text-decoration:none;
border-bottom:1px dotted #ffffff;
}
ul.ljtaglist li {
list-style-image:url(http://i29.tinypic.com/29ftvl5.png);
}
.ljtags {
color:#ececec;
margin-top:15px;
text-align:center;
}
.ljtags a {
font-weight:bold;
}
.clear {
height: 15px;
}
.ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] {
background-color:transparent;
background-image: url(http://i39.tinypic.com/dokufs.png)!important;
background-repeat: no-repeat!important;
padding:5px;
}
.ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] {
background-color:transparent;
background-image: url(http://i42.tinypic.com/mc50du.png)!important;
background-repeat: no-repeat!important;
padding:5px;
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color: transparent;
padding:13px 13px 4px 5px !important;
}
img[src="http://l-stat.livejournal.com/img/btn_del.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i44.tinypic.com/14d0wmw.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_edit.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i40.tinypic.com/1r2b14.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_scr.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i44.tinypic.com/245ilb7.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_unscr.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i39.tinypic.com/zl96b9.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_track.gif"], img[src="http://l-stat.livejournal.com/img/btn_tracking.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i44.tinypic.com/257najq.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_freeze.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i39.tinypic.com/ydzwh.jpg);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_unfreeze.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i42.tinypic.com/fmthmp.png);
width: 0px;
height: 0px;
}
div.ContextualPopup div.Inner {
background:transparent!important;
color: #9de6f7!important;
border:none;
padding:10px;
width: 250px;
font-family: "Century Gothic", sans-serif;
font-size: 12px;
text-align:justify;
}
div.ContextualPopup .Content {
padding:7px 10px 7px 10px;
margin-right:80px;
line-height: 1.4;
background-color:#ececec;
border:1px solid #9de6f7;
}
div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited {
text-decoration:none !important;
color:#FFF !important;
font-weight:normal !important;
}
div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
text-decoration: none !important;
font-weight: normal;
color: #f07c00 !important;
}
div.ContextualPopup .Relation {
letter-spacing:1px;
border-bottom: 1px dotted #FFF;
margin-bottom:4px;
padding-bottom:4px;
}
problems?
do you have any problems? just comment, I'll try to help you!
if you want to add a header, just search for this:
.headerimage {
background-image:url(http://i32.tinypic.com/516hwy.png);
background-repeat:no-repeat;
height:172px;
width:663px;
position:absolute;
right:7%;
margin: 10% 0 0 0;
}
There's an example header in your layout. If you want to have NO header, just remove the link "http://i32.tinypic.com/516hwy.png".
if you want to add your own header, replace the link of your header with the "http://i32.tinypic.com/516hwy.png" link above. Make sure you also change height and width! Height = height of your header, width = the width of your header.
credit.
please do not claim the layout as yours and credit arcticdesign, NOT mintyapple!!
comments are highly appreciated ♥
watch/join arcticdesign
Basic, Plus and Paid.
Tested on Firefox 3.5, Windows Vista, 1280 x 800.
IE 8 should be okay, too. (Although I'm not supporting IE. So if you have problems, rather change to Firefox. There are plenty of advantages ;D)
have fun!
WITHOUT SIDEBAR.
live
WITH SIDEBAR.
live
Instructions
1) Click here in order to customize your layout.
2) Type in the search box 'Flexible Squares' and apply and apply either "Blue Grey" or "Black and White and Red All Over".
3) Go to Custom CSS. Set everything to No.
4) Paste in the 'Custom Stylesheet' box the following code.
Code
Without Sidebar:
/* CSS by loosegraphics @ arcticdesign.livejournal.com DO NOT REMOVE THIS SECTION. find .headerimage for your personal header */
body {
background-color: #9de6f7;
text-align: center;
color: #636869;
font-family: "Century Gothic", Georgia, sans-serif;
font-size: 12px;
margin: 20px 0 20px 0;
}
a, a:link, a:visited {
color: #9de6f7;
text-decoration: none;
}
a:hover {
color: #9de6f7;
text-decoration: none;
border-bottom:1px dotted #9de6f7;
cursor:help;
}
p, td, blockquote {
font-size: 11px;
}
blockquote {
border:1px solid #d6d4d4;
padding:7px;
margin-top:20px;
font-family:Century Gothic;
}
code, kbd, pre, tt {
font-family: monospace;
}
#content
{
width: 60%;
padding: 15px;
position: absolute;
right:2%;
margin: 30% 0 0 0;
}
#maincontent {
margin-top: 15px;
font-family: "Century Gothic", sans-serif;
font-size: 12px;
text-align: left;
}
#header {
width: 100%;
padding: 10px 0px 20px 0px;
margin: 0px;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: bold;
letter-spacing: 2px;
color: #000000;
}
.headerimage {
background-image:url(http://i32.tinypic.com/516hwy.png);
;){kind=link}
background-repeat:no-repeat;
height:172px;
width:663px;
position:absolute;
right:7%;
margin: 15% 0 0 0;
}
div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
color: #86c1cf;
}
div#header a, div#header li.view {
padding:15px 50px;
height:60px;
width:115px;
background-image: url(http://i29.tinypic.com/2wn06rp.png);
;){kind=link}
background-repeat: no-repeat;
background-position: center;
font-family:Century Gothic;
font-size:20px;
letter-spacing:-2px;
text-transform:lowercase;
font-weight:normal;
}
div#header a:active, div#header a:hover {
background-image: url(http://i30.tinypic.com/2qlwmdd.png);
;){kind=link}
background-repeat: no-repeat;
background-position: center;
}
div#footer a, div#footer a:link, div#footer a:visited {
color:#FFFFFF;
font-size:23px;
}
div#footer a:hover {
text-decoration:none;
border-bottom:1px #ffffff dotted;
}
.title {
font-family: Georgia;
font-size: 48px;
letter-spacing:-3px;
font-weight: normal;
line-height: 200%;
top: 10px;
}
.subtitle{
font-family: "Lucida Sans Unicode", sans-serif;
font-size: 18px;
text-transform: uppercase;
font-weight: normal;
top: 10px;
margin-top:-10px;
}
ul.navheader
{
padding: 0px;
margin: 0px;
margin-bottom:25px;
}
ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}
.subcontent {
background-color:#ececec;
border:1px solid #86c1cf;
}
.entry {
margin: 0px 10px 10px 30px;
padding: 10px;
background-color: #ececec;
color: #636869;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
}
.entry a {
font-weight:bold;
}
.userpic {
position: absolute;
left:-20%;
padding: 13px;
margin: 10px;
margin-top:-1px;
text-align: center;
background-color:#ececec !important;
border: 1px solid #86c1cf;
z-index: 25;
}
.userpic a {
display:none;
}
.date {
top: 5px;
line-height: 200%;
color: #000000;
font-family: "Trebuchet ;S", sans-serif;
font-size: 10px;
letter-spacing:3px;
opacity:0.7;
}
.subject {
padding: 10px;
padding-top:0;
color: #636869;
font-family: "Century Gothic", sans-serif;
text-transform: uppercase;
font-size: 14px;
letter-spacing:-1px;
}
.subject a, .subject a:link, .subject a:visited {
color: #636869;
}
.subject a:hover {
text-decoration:none;
border-bottom:1px dotted;
}
.datesubject {
background-color: #ececec;
padding: 5px;
text-align:center;
}
.entry ul li, .entry ol li
{
padding-left: 5px;
margin-left: 15px;
}
.currents, .currentmood, .currentmusic {
font-family: "Century Gothic", sans-serif;
font-size: 14px;
text-transform:lowercase;
letter-spacing:-1px;
}
.currents strong {
display:none;
}
.currents a {
font-weight:normal !important;
}
.comments {
font-family: "Century Gothic", sans-serif;
font-size: 14px;
text-align: right;
padding: 0px 5px 0px 5px;
position: relative;
top: 15px;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #636869;
font-weight:normal !important;
}
div.comments a:hover {
cursor:help;
text-decoration: none;
}
.separator {
height: 35px;
}
.userpicfriends {
position: absolute;
left:-20%;
padding: 13px;
margin: 10px;
margin-top:-1px;
text-align: center;
background-color:#ececec !important;
border: 1px solid #86c1cf;
z-index: 25;
}
.userpicfriends a {
font-family:Century Gothic;
font-size:12px;
letter-spacing:-1px;
color:#9de6f7;
font-weight:bold;
}
.userpicfriends img {
margin: 0 0 5px 0;
}
#userpics a {
color:#000;
}
.defaultuserpic {
text-align: center;
}
.defaultuserpic img {
margin-top:8px;
border:10px solid #ffffff;
background:#ffffff;
}
.defaultuserpic a:hover {
border:none !important;
}
#sidebar {
display:none;
}
#footer {
width: 100%;
text-align: center;
font-family: "Century Gothic", sans-serif;
font-size: 23px;
letter-spacing: -1px;
color: #FFFFFF;
z-index: 100;
clear: both;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
ul.year {
text-align: center;
padding-bottom: 20px;
font-family:Georgia;
font-size:30px;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border:1px solid #86c1cf;
font-family: Century Gothic;
}
table.yeartable td.yearday {
background-color: #ececec;
text-align: center;
}
table.yeartable td.yeardate a {
color:#ffffff !important;
font-size:13px;
}
td.yearmonth {
border-style: none;
}
.datesubjectcomment {
padding: 5px;
margin-top: 20px;
}
.userpiccomment {
position: absolute;
left:-20%;
padding: 13px;
margin: 10px;
margin-top:-1px;
text-align: center;
background-color:#ececec !important;
border:1px solid #86c1cf;
z-index: 25;
}
.box {
border-style: solid;
border-width: 1px 0px 0px 0px;
border-color: #999999;
padding: 10px;
clear: left;
}
.box center a {
color:#ffffff;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
}
.box a {
font-weight:bold;
}
.box b {
color:#ffffff;
}
input {
background-color: #d4dce8;
color: #000000;
}
input.textbox#subject {
background-color:#ffffff;
font-family:Century Gothic;
}
textarea.textbox {
width: 100% !important;
}
textarea.textbox#commenttext {
font-family:Century Gothic;
font-size:14px;
letter-spacing:-1px;
}
.entry textarea {
margin-left:40%;
margin-top:20px;
font-family:Century Gothic;
background-color:#f9f9f9;
opacity:0.7;
font-size:10px;
text-transform:lowercase;
}
.entry textarea:hover {
opacity:1.0;
}
.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: #d4dce8;
color: #000000;
}
.replytosubject {
font-weight: bold;
}
.commentreply {
position: relative;
margin: 10px;
color: #636869;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
}
.commentbox {
border: #86c1cf 1px solid;
padding: 10px;
margin: 10px;
background-color: #ececec;
}
.datesubjectcomment {
color:#000;
font-family:Century Gothic;
font-size:13px;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #9de6f7;
font-family:Century Gothic;
font-size:13px;
}
.datesubjectcomment a:hover {
color: #b0b9c8;
}
.commentboxpartial {
border-color: #999999;
border-width: 1px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: #d4dce8;
}
.commentinfo {
background-color: #d4dce8;
margin-top: 10px;
width: 100%;
}
.skiplinks, .skiplinks a {
text-align: center;
color:#fff;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
text-transform:lowercase;
}
.skiplinks a:hover {
border-bottom:1px #ffffff dotted;
}
ul.ljtaglist a {
font-size:13px;
color:#ffffff;
font-weight:bold;
}
ul.ljtaglist a:hover {
text-decoration:none;
border-bottom:1px dotted #ffffff;
}
ul.ljtaglist li {
list-style-image:url(http://i29.tinypic.com/29ftvl5.png);
;){kind=link}
}
.ljtags {
color:#ececec;
margin-top:15px;
text-align:center;
}
.ljtags a {
font-weight:bold;
}
.clear {
height: 15px;
}
.ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] {
background-color:transparent;
background-image: url(http://i39.tinypic.com/dokufs.png)!important;
!important;){kind=link}
background-repeat: no-repeat!important;
padding:5px;
}
.ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] {
background-color:transparent;
background-image: url(http://i42.tinypic.com/mc50du.png)!important;
!important;){kind=link}
background-repeat: no-repeat!important;
padding:5px;
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color: transparent;
padding:13px 13px 4px 5px !important;
}
img[src="http://l-stat.livejournal.com/img/btn_del.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i44.tinypic.com/14d0wmw.png);
;){kind=link}
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_edit.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i40.tinypic.com/1r2b14.png);
;){kind=link}
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_scr.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i44.tinypic.com/245ilb7.png);
;){kind=link}
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_unscr.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i39.tinypic.com/zl96b9.png);
;){kind=link}
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_track.gif"], img[src="http://l-stat.livejournal.com/img/btn_tracking.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i44.tinypic.com/257najq.png);
;){kind=link}
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_freeze.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i39.tinypic.com/ydzwh.jpg);
;){kind=link}
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_unfreeze.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i42.tinypic.com/fmthmp.png);
;){kind=link}
width: 0px;
height: 0px;
}
div.ContextualPopup div.Inner {
background:transparent!important;
color: #9de6f7!important;
border:none;
padding:10px;
width: 250px;
font-family: "Century Gothic", sans-serif;
font-size: 12px;
text-align:justify;
}
div.ContextualPopup .Content {
padding:7px 10px 7px 10px;
margin-right:80px;
line-height: 1.4;
background-color:#ececec;
border:1px solid #9de6f7;
}
div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited {
text-decoration:none !important;
color:#FFF !important;
font-weight:normal !important;
}
div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
text-decoration: none !important;
font-weight: normal;
color: #f07c00 !important;
}
div.ContextualPopup .Relation {
letter-spacing:1px;
border-bottom: 1px dotted #FFF;
margin-bottom:4px;
padding-bottom:4px;
}
With Sidebar:
/* CSS by loosegraphics @ arcticdesign.livejournal.com DO NOT REMOVE THIS SECTION. find .headerimage for your personal header */
body {
background-color: #9de6f7;
text-align: center;
color: #636869;
font-family: "Century Gothic", Georgia, sans-serif;
font-size: 12px;
margin: 20px 0 20px 0;
}
a, a:link, a:visited {
color: #9de6f7;
text-decoration: none;
}
a:hover {
color: #9de6f7;
text-decoration: none;
border-bottom:1px dotted #9de6f7;
cursor:help;
}
p, td, blockquote {
font-size: 11px;
}
blockquote {
border:1px solid #d6d4d4;
padding:7px;
margin-top:20px;
font-family:Century Gothic;
}
code, kbd, pre, tt {
font-family: monospace;
}
#content
{
width: 60%;
padding: 15px;
position: absolute;
right:2%;
margin: 30% 0 0 0;
}
#maincontent {
margin-top: 15px;
font-family: "Century Gothic", sans-serif;
font-size: 12px;
text-align: left;
}
#sidebar {
position:absolute;
left:-60%;
top:12%;
background-color: #ececec;
border: 1px solid #86c1cf;
font-size: 11px;
font-family: "Century Gothic", sans-serif;
color: #000000;
width: 24%;
z-index:200 !important;
}
#header {
width: 100%;
padding: 10px 0px 20px 0px;
margin: 0px;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: bold;
letter-spacing: 2px;
color: #000000;
}
.headerimage {
background-image:url(http://i32.tinypic.com/516hwy.png);
background-repeat:no-repeat;
height:172px;
width:663px;
position:absolute;
right:7%;
margin: 15% 0 0 0;
}
div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
color: #86c1cf;
}
div#header a, div#header li.view {
padding:15px 50px;
height:60px;
width:115px;
background-image: url(http://i29.tinypic.com/2wn06rp.png);
background-repeat: no-repeat;
background-position: center;
font-family:Century Gothic;
font-size:20px;
letter-spacing:-2px;
text-transform:lowercase;
font-weight:normal;
}
div#header a:active, div#header a:hover {
background-image: url(http://i30.tinypic.com/2qlwmdd.png);
background-repeat: no-repeat;
background-position: center;
}
div#footer a, div#footer a:link, div#footer a:visited {
color:#FFFFFF;
font-size:23px;
}
div#footer a:hover {
text-decoration:none;
border-bottom:1px #ffffff dotted;
}
.title {
font-family: Georgia;
font-size: 48px;
letter-spacing:-3px;
font-weight: normal;
line-height: 200%;
top: 10px;
}
.subtitle{
font-family: "Lucida Sans Unicode", sans-serif;
font-size: 18px;
text-transform: uppercase;
font-weight: normal;
top: 10px;
margin-top:-10px;
}
ul.navheader
{
padding: 0px;
margin: 0px;
margin-bottom:25px;
}
ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}
.subcontent {
background-color:#ececec;
border:1px solid #86c1cf;
}
.entry {
margin: 0px 10px 10px 30px;
padding: 10px;
background-color: #ececec;
color: #636869;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
}
.entry a {
font-weight:bold;
}
.userpic {
position: absolute;
left:-20%;
padding: 13px;
margin: 10px;
margin-top:-1px;
text-align: center;
background-color:#ececec !important;
border: 1px solid #86c1cf;
z-index: 25;
}
.userpic a {
display:none;
}
.date {
top: 5px;
line-height: 200%;
color: #000000;
font-family: "Trebuchet ;S", sans-serif;
font-size: 10px;
letter-spacing:3px;
opacity:0.7;
}
.subject {
padding: 10px;
padding-top:0;
color: #636869;
font-family: "Century Gothic", sans-serif;
text-transform: uppercase;
font-size: 14px;
letter-spacing:-1px;
}
.subject a, .subject a:link, .subject a:visited {
color: #636869;
}
.subject a:hover {
text-decoration:none;
border-bottom:1px dotted;
}
.datesubject {
background-color: #ececec;
padding: 5px;
text-align:center;
}
.entry ul li, .entry ol li
{
padding-left: 5px;
margin-left: 15px;
}
.currents, .currentmood, .currentmusic {
font-family: "Century Gothic", sans-serif;
font-size: 14px;
text-transform:lowercase;
letter-spacing:-1px;
}
.currents strong {
display:none;
}
.currents a {
font-weight:normal !important;
}
.comments {
font-family: "Century Gothic", sans-serif;
font-size: 14px;
text-align: right;
padding: 0px 5px 0px 5px;
position: relative;
top: 15px;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #636869;
font-weight:normal !important;
}
div.comments a:hover {
cursor:help;
text-decoration: none;
}
.separator {
height: 35px;
}
.userpicfriends {
position: absolute;
left:-20%;
padding: 13px;
margin: 10px;
margin-top:-1px;
text-align: center;
background-color:#ececec !important;
border: 1px solid #86c1cf;
z-index: 25;
}
.userpicfriends a {
font-family:Century Gothic;
font-size:12px;
letter-spacing:-1px;
color:#9de6f7;
font-weight:bold;
}
.userpicfriends img {
margin: 0 0 5px 0;
}
#userpics a {
color:#000;
}
.defaultuserpic {
text-align: center;
}
.defaultuserpic img {
margin-top:8px;
border:10px solid #ffffff;
background:#ffffff;
}
.defaultuserpic a:hover {
border:none !important;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px 5px 0px 5px;
}
.sbarbody2 {
padding: 0 15px 0 15px;
margin-left:20px;
color: #636869;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
text-align:center;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #9de6f7;
}
div#sidebar a:hover {
border-bottom:1px dotted #9de6f7;
text-decoration: none;
}
table.calendar {
margin-right: auto;
margin-left: auto;
}
.sbarcalendar {
text-align: center;
font-family: "Century Gothic", sans-serif;
font-size: 11px;
}
.sbarcalendarposts {
border: 1px #86c1cf solid;
background-color: #9de6f7;
text-align: center;
font-family: "Century Gothic", sans-serif;
font-size: 11px;
}
.sbarcalendarposts a {
color:#FFFFFF !important;
}
ul.sbarlist
{
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbaritem
{
padding-left: 15px;
list-style: none;
font-weight:bold;
text-transform:uppercase;
}
li.sbartitle
{
padding-left: 15px;
list-style: none;
font-family:Century Gothic;
text-transform:lowercase;
font-size:15px;
font-weight:bold;
color:#ffffff;
border-bottom:1px #ffffff dotted;
letter-spacing:-1px;
margin-bottom: 10px;
margin-top: 10px;
}
#footer {
width: 100%;
text-align: center;
font-family: "Century Gothic", sans-serif;
font-size: 23px;
letter-spacing: -1px;
color: #FFFFFF;
z-index: 100;
clear: both;
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
ul.year {
text-align: center;
padding-bottom: 20px;
font-family:Georgia;
font-size:30px;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border:1px solid #86c1cf;
font-family: Century Gothic;
}
table.yeartable td.yearday {
background-color: #ececec;
text-align: center;
}
table.yeartable td.yeardate a {
color:#ffffff !important;
font-size:13px;
}
td.yearmonth {
border-style: none;
}
.datesubjectcomment {
padding: 5px;
margin-top: 20px;
}
.userpiccomment {
position: absolute;
left:-20%;
padding: 13px;
margin: 10px;
margin-top:-1px;
text-align: center;
background-color:#ececec !important;
border:1px solid #86c1cf;
z-index: 25;
}
.box {
border-style: solid;
border-width: 1px 0px 0px 0px;
border-color: #999999;
padding: 10px;
clear: left;
}
.box center a {
color:#ffffff;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
}
.box a {
font-weight:bold;
}
.box b {
color:#ffffff;
}
input {
background-color: #d4dce8;
color: #000000;
}
input.textbox#subject {
background-color:#ffffff;
font-family:Century Gothic;
}
textarea.textbox {
width: 100% !important;
}
textarea.textbox#commenttext {
font-family:Century Gothic;
font-size:14px;
letter-spacing:-1px;
}
.entry textarea {
margin-left:40%;
margin-top:20px;
font-family:Century Gothic;
background-color:#f9f9f9;
opacity:0.7;
font-size:10px;
text-transform:lowercase;
}
.entry textarea:hover {
opacity:1.0;
}
.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: #d4dce8;
color: #000000;
}
.replytosubject {
font-weight: bold;
}
.commentreply {
position: relative;
margin: 10px;
color: #636869;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
}
.commentbox {
border: #86c1cf 1px solid;
padding: 10px;
margin: 10px;
background-color: #ececec;
}
.datesubjectcomment {
color:#000;
font-family:Century Gothic;
font-size:13px;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #9de6f7;
font-family:Century Gothic;
font-size:13px;
}
.datesubjectcomment a:hover {
color: #b0b9c8;
}
.commentboxpartial {
border-color: #999999;
border-width: 1px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: #d4dce8;
}
.commentinfo {
background-color: #d4dce8;
margin-top: 10px;
width: 100%;
}
.skiplinks, .skiplinks a {
text-align: center;
color:#fff;
font-family: "Lucida Sans Unicode", sans-serif;
letter-spacing:-1px;
font-size: 12px;
text-transform:lowercase;
}
.skiplinks a:hover {
border-bottom:1px #ffffff dotted;
}
ul.ljtaglist a {
font-size:13px;
color:#ffffff;
font-weight:bold;
}
ul.ljtaglist a:hover {
text-decoration:none;
border-bottom:1px dotted #ffffff;
}
ul.ljtaglist li {
list-style-image:url(http://i29.tinypic.com/29ftvl5.png);
}
.ljtags {
color:#ececec;
margin-top:15px;
text-align:center;
}
.ljtags a {
font-weight:bold;
}
.clear {
height: 15px;
}
.ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] {
background-color:transparent;
background-image: url(http://i39.tinypic.com/dokufs.png)!important;
background-repeat: no-repeat!important;
padding:5px;
}
.ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] {
background-color:transparent;
background-image: url(http://i42.tinypic.com/mc50du.png)!important;
background-repeat: no-repeat!important;
padding:5px;
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color: transparent;
padding:13px 13px 4px 5px !important;
}
img[src="http://l-stat.livejournal.com/img/btn_del.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i44.tinypic.com/14d0wmw.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_edit.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i40.tinypic.com/1r2b14.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_scr.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i44.tinypic.com/245ilb7.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_unscr.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i39.tinypic.com/zl96b9.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_track.gif"], img[src="http://l-stat.livejournal.com/img/btn_tracking.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i44.tinypic.com/257najq.png);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_freeze.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i39.tinypic.com/ydzwh.jpg);
width: 0px;
height: 0px;
}
img[src="http://l-stat.livejournal.com/img/btn_unfreeze.gif"] {
padding: 0 0 16px 16px !important;
background: url(http://i42.tinypic.com/fmthmp.png);
width: 0px;
height: 0px;
}
div.ContextualPopup div.Inner {
background:transparent!important;
color: #9de6f7!important;
border:none;
padding:10px;
width: 250px;
font-family: "Century Gothic", sans-serif;
font-size: 12px;
text-align:justify;
}
div.ContextualPopup .Content {
padding:7px 10px 7px 10px;
margin-right:80px;
line-height: 1.4;
background-color:#ececec;
border:1px solid #9de6f7;
}
div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited {
text-decoration:none !important;
color:#FFF !important;
font-weight:normal !important;
}
div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
text-decoration: none !important;
font-weight: normal;
color: #f07c00 !important;
}
div.ContextualPopup .Relation {
letter-spacing:1px;
border-bottom: 1px dotted #FFF;
margin-bottom:4px;
padding-bottom:4px;
}
problems?
do you have any problems? just comment, I'll try to help you!
if you want to add a header, just search for this:
.headerimage {
background-image:url(http://i32.tinypic.com/516hwy.png);
background-repeat:no-repeat;
height:172px;
width:663px;
position:absolute;
right:7%;
margin: 10% 0 0 0;
}
There's an example header in your layout. If you want to have NO header, just remove the link "http://i32.tinypic.com/516hwy.png".
if you want to add your own header, replace the link of your header with the "http://i32.tinypic.com/516hwy.png" link above. Make sure you also change height and width! Height = height of your header, width = the width of your header.
credit.
please do not claim the layout as yours and credit arcticdesign, NOT mintyapple!!
comments are highly appreciated ♥
watch/join arcticdesign
Basic, Plus and Paid.
Tested on Firefox 3.5, Windows Vista, 1280 x 800.
IE 8 should be okay, too. (Although I'm not supporting IE. So if you have problems, rather change to Firefox. There are plenty of advantages ;D)
have fun!