A couple of winter designs

Dec 08, 2009 14:15


Design 1 - Bench&Trees under Snow



Bigger

1. Expressive
2. 2 Column (sidebar on left)
3. Firefox, Opera, IE 7


1. On the Customize Page type Unstyled into the search box. Find the one for Expressive, hit apply.
2. Choose the "2 Column (sidebar on left)". Hit the Customize Selected Theme button.
3. In the section Custom CSS paste the following code into the Custom stylesheet field. Hit save. Enjoy!

body{
background-color:#e3e7ec;
font-family: Times;
font-size:16px;}

a:link, a:visited, a font, a b{
color:#4d4b4e;
font-weight:normal;
text-decoration:underline;
}

a:hover, a:hover b{
color: #b7c5d6;
font-weight:normal;
text-decoration:none;
}

#container{
background-color:transparent;
width:900px;
margin:auto;
margin-top:20px;
}
#container-inner{
width:900px;
margin:0px;
padding:0px;
}
#page{
width:900px;
margin:0px;
padding:0px;
background-color:transparent;
}

#page-inner{
width:900px;
padding:0px;
margin:0px;
}

#header{
background-image:url(http://i796.photobucket.com/albums/yy241/j_sparrow_t/LJ%20and%20DW%20designs/snow-bench-header.jpg);
width:900px;
height:366px;
background-repeat:no-repeat;
padding:0px;
margin:0px;
background-color:transparent;
}
div#header-content{
margin:0px;
padding:0px;}

div#header-content-inner{
margin:0px;
padding:0px;
}
div#header-text{
width:900px;
text-align:center;
}
ul.nav{
width:960px;
position:relative;
margin-top:2px;
font-size: 18px;
}
.nav a {
color: #4d4b4e;
text-decoration: none;
}
.nav a:hover {
color: #b7c5d6;
text-decoration: none;
}
ul.nav li.item{
border:none;
float:none;
display:inline;
}
#header-name {
text-align:center;
width:960px;
font-size:23px;
font-variant:small-caps;
margin-top:20px;
}
#header-name a{
color:#b7c5d6;
text-decoration:none;
}
#header-name a:hover{
color:#b7c5d6;
text-decoration:none;
}

#header-description{
display:none;
}

#content {
width:900px;
background-color:transparent;
padding:0px;
margin:0px;
}
#content-inner {
width:900px;
padding: 0px;
margin:0px;
background-image:url(http://pics.livejournal.com/tryout_cover/pic/000c5sh2);
background-repeat:no-repeat;
background-position:top !important;
}
#alpha {
width:720px;
padding: 0px;
margin:0px;
margin-top:50px;
background-color:transparent;
}
#alpha-inner {
width: 720px;
padding: 0px;
margin-left: 0px;
}
#beta {
width: 168px;
float: left;
margin: 0px;
padding: 0px;
margin-top:115px;
background-color:transparent;
}
#beta-inner {
width: 168px;
padding: 0px;
margin:0px;
}
#gamma {
display: none;
}
.stream-header {
position: relative;
margin-top: 20px;
margin-bottom: 15px;
}
p.prevnext, .skiplinks {
width: 720px;
text-align:center;
font-size: 15px;
}
p.prevnext a, .skiplinks a{
color: #4d4b4e;
text-decoration: none;
}
p.prevnext a:hover, .skiplinks a:hover{
text-decoration: underline;
color:#4d4b4e;
}

.asset {
width: 715px;
margin:0px;
padding:0px;
}
.asset-inner {
width: 715px;
margin:0px;
padding:0px;
margin-bottom:25px;
}
.asset-body {
width: 710px;
padding:0px;
margin:0px;
margin-bottom:15px;
}
.asset-header {
width:680px;
padding: 0px;
font-size:21px;
background-image:url(http://pics.livejournal.com/tryout_cover/pic/000c8rwa);
background-repeat:no-repeat;
}
.asset-header a{
color: #b7c5d6;
text-decoration:none;
font-variant:small-caps;
padding-left:65px;
}
.asset-header a:hover {
color: #b7c5d6;
text-decoration:underline;
font-variant:small-caps;
}

div.asset-header li.item {
float:left;
color:dark gray;
font-size:12.5px;
padding-left:55px;
}
.asset-meta-list {
font-size:14px;
}
.asset-meta-list a{
color: #4d4b4e;
text-decoration: none;
}
.asset-meta-list a:hover {
color: #4d4b4e;
text-decoration: underline;
}

.asset-content {
width: 710px;
text-align: justify;
margin:0px;
padding:0px;
}

.user-icon {
float:left;
margin-right:7px;
padding-bottom: 3px;
border:none;
background-color:transparent !important;
text-align:center;
font-size:10px;
}
.user-icon span {
background-color:transparent !important;
}
.user-icon img {
border:5px solid #b7c5d6;
}
img[src*="userinfo.gif"] {
padding: 0px;
}
img[src*="community.gif"] {
padding: 0px;
}

lj.currents {
width:710px;
position: relative;
margin-top: 10px;
}

.entryMetadata-label {
font-size:14px;
}
.entryMetadata-content {
font-size:14px;
margin-left:3px;
}
.asset-tags {
width:710px;
padding: 0px;
margin:0px;
}
h4.asset-tags-header {
font-size: 14px !important;
font-weight: bolder;
}
ul.asset-tags-list {
font-size:14px;
padding-left:3px !important;
}
.asset-tags-list li.item a {
color:#4d4b4e;
text-decoration:underline;
}

.asset-tags-list li.item a:hover {
text-transform: none;
color: #b7c5d6;
background-color: transparent;
text-decoration:none;
}
.asset-footer {
background-image:url(http://pics.livejournal.com/tryout_cover/pic/000c7yq0);
width:715px;
height:50px;
background-repeat:no-repeat;
}

.widget {
width:168px;
font-size:13.5px;
}
.widget-inner {
width:168px;
padding:0px;
}
h3.widget-header {
font-weight: bolder;
font-variant:small-caps;
color:#4d4b4e;
background-color:#b7c5d6;
font-size:16px;
text-align:center;
}

h3.widget-header a{
font-weight:bolder;
font-variant:small-caps;
color:#4d4b4e;
text-decoration:none;
}

h3.widget-header a:hover {
font-weight:bolder;
font-variant:small-caps;
text-decoration:none;
color:#4d4b4e;
}
.calendar-widget table {
margin-left:-8px;}

ul.year {
font-size:20px;
}

#comments {
width:720px;
}
div .comments-inner {
width:720px;
margin-left:0px;
}

div.comments-body {
width:720px;
text-align:justify;
}

.comment-odd {
padding: 3px;
border: none;
border-bottom: #b7c5d6 3px dotted;
}
.comment-even {
padding: 3px;
border:none;
border-bottom: #ded6d4 3px dotted;
}
.comments-header.page-header2 {
width:720px;
font-size: 23px;
color:#b7c5d6;
font-variant:small-caps;
margin-top:10px;
padding-left:5px;
font-weight:normal;
}
div.comment-body {
margin:5px;
margin-bottom:10px;
font-size:14.5px;
}

Design 2 - Winter Umbrella



Bigger

1. Expressive
2. 2 Column (sidebar on left)
3. Firefox, Opera, IE 7


1. On the Customize Page type Unstyled into the search box. Find the one for Expressive, hit apply.
2. Choose the "2 Column (sidebar on left)". Hit the Customize Selected Theme button.
3. In the section Custom CSS paste the following code into the Custom stylesheet field. Hit save. Enjoy!

body{
background-color:#ded6d4;
background-image:url(http://i796.photobucket.com/albums/yy241/j_sparrow_t/LJ%20and%20DW%20designs/Untitled-2.jpg);
font-family: Book Antiqua; Georgia;
font-size:15px;}

a:link, a:visited, a font, a b{
color:#bc130e;
font-weight:normal;
text-decoration:underline;
}

a:hover, a:hover b{
color: #bc130e;
font-weight:normal;
text-decoration:none;
}

#container{
background-color:transparent;
width:930px;
margin:auto;
}
#container-inner{
width:930px;
margin:0px;
padding:0px;
}
#page{
width:930px;
margin:0px;
padding:0px;
background-color:#f5f5f5;
}

#page-inner{
width:930px;
padding:0px;
margin:0px;
}

#header{
background-image:url(http://i796.photobucket.com/albums/yy241/j_sparrow_t/LJ%20and%20DW%20designs/winter-umbrella-diz-header.jpg);
width:930px;
height:351px;
background-repeat:no-repeat;
padding:0px;
margin:0px;
}
div#header-content{
margin:0px;
padding:0px;}

div#header-content-inner{
margin:0px;
padding:0px;
}
div#header-text{
width:930px;
text-align:right;
}
ul.nav{
width:930px;
position:relative;
margin-top:10px;
font-size: 21px;
}
.nav a {
color: #bc130e;
text-decoration: none;
}
.nav a:hover {
color: #bc130e;
text-decoration: underline;
}
ul.nav li.item{
border:none;
float:none;
display:inline;
}
#header-name {
text-align:right;
width:920px;
font-size:28px;
font-variant:small-caps;
margin-top:55px;
}
#header-name a{
color:#bc130e;
text-decoration:none;
}
#header-name a:hover{
color:#bc130e;
text-decoration:none;
}

#header-description{
display:none;
}

#content {
width:930px;
background-color:transparent;
padding:0px;
margin:0px;
}
#content-inner {
width:930px;
padding: 0px;
margin:0px;
background-image:url(http://i796.photobucket.com/albums/yy241/j_sparrow_t/LJ%20and%20DW%20designs/winter-umbrella-diz-content.jpg);
background-repeat:no-repeat;
background-position:top !important;
}
#alpha {
width:740px;
padding: 0px;
margin:0px;
margin-top:45px;
}
#alpha-inner {
width: 740px;
padding: 0px;
margin-left: 0px;
}
#beta {
width: 185px;
float: left;
margin: 0px;
padding: 0px;
margin-top:95px;
}
#beta-inner {
width: 185px;
padding: 0px;
margin:0px
}
#gamma {
display: none;
}
.stream-header {
position: relative;
margin-top: 15px;
margin-bottom: 15px;
}
p.prevnext, .skiplinks {
width: 730px;
text-align:center;
font-size: 16px;
}
p.prevnext a, .skiplinks a{
color: #bc130e;
text-decoration: none;
}
p.prevnext a:hover, .skiplinks a:hover{
text-decoration: underline;
color:#bc130e;
}

.asset {
width: 735px;
margin:0px;
padding:0px;
}
.asset-inner {
width: 735px;
margin:0px;
padding:0px;
margin-bottom:25px;
}
.asset-body {
width: 730px;
padding:0px;
margin:0px;
margin-bottom:15px;
}
.asset-header {
width:650px;
padding: 0px;
font-size:23px;
background-image:url(http://i796.photobucket.com/albums/yy241/j_sparrow_t/LJ%20and%20DW%20designs/zz5.png);
background-repeat:no-repeat;
padding-left:70px;
}
.asset-header a{
color: #bc130e;
text-decoration:none;
font-variant:small-caps;
}
.asset-header a:hover {
color: #bc130e;
text-decoration:underline;
font-variant:small-caps;
}

div.asset-header li.item {
float:left;
color:dark gray;
font-size:12.5px;
}
.asset-meta-list {
font-size:14px;
}
.asset-meta-list a{
color: #bc130e;
text-decoration: none;
}
.asset-meta-list a:hover {
color: #bc130e;
text-decoration: underline;
}

.asset-content {
width: 730px;
text-align: justify;
margin:0px;
padding:0px;
}

.user-icon {
float:left;
margin-right:7px;
margin-bottom: 3px;
border:none;
background-color:transparent !important;
text-align:center;
font-size:10px;
}
.user-icon span {
background-color:transparent !important;
}
.user-icon img {
border:5px solid #ded6d4;
}
img[src*="userinfo.gif"] {
padding: 0px;
}
img[src*="community.gif"] {
padding: 0px;
}

lj.currents {
width:710px;
position: relative;
margin-top: 10px;
}
.asset-meta list {
font-size:14px;
}

.entryMetadata-label {
font-size:14px;
}
.entryMetadata-content {
font-size:14px;
}
.asset-tags {
width:730px;
margin-top: 8px;
padding: 0px;
font-size:14px;
}
h4.asset-tags-header {
font-size: 14px !important;
font-weight: bolder;
margin-left:2px;
}
.asset-tags-list {
font-size:14px;
}
.asset-tags-list li.item a {
color:#bc130e;
text-decoration:none;
}

.asset-tags-list li.item a:hover {
text-transform: none;
color: #bc130e;
background-color: transparent;
text-decoration:underline;
}

.widget {
width:184px;
font-size:12.5px;
}
.widget-inner {
width:184px;
padding:0px;
}
h3.widget-header {
font-weight: bolder;
font-variant:small-caps;
color:#bc130e;
background-color:#ded6d4;
font-size:16px;
}

h3.widget-header a{
font-weight:bolder;
font-variant:small-caps;
color:#bc130e;
text-decoration:none;
}

h3.widget-header a:hover {
font-weight:bolder;
font-variant:small-caps;
text-decoration:none;
color:#bc130e;
}
.calendar-widget table {
margin-left:-8px;}

ul.year {
font-size:20px;
}

#comments {
width:735px;
}
div .comments-inner {
width:735px;
margin-left:0px;
}

div.comments-body {
width:735px;
text-align:justify;
}

.comment-odd {
padding: 3px;
border: none;
border-bottom: #ded6d4 3px dotted;
}
.comment-even {
padding: 3px;
border:none;
}
.comments-header.page-header2 {
width:710px;
font-size: 20px;
color: #bc130e;
font-variant:small-caps;
margin-top:10px;
margin-left:4px;
}
div.comment-body {
margin:5px;
margin-bottom:10px;
font-size:14.5px;
}

Credit! Layout: sparrow_design. Or see codes for colourful banners in the sparrow_design community profile!

style: expressive

Previous post Next post
Up