layoutlounge | 82. Let It Snow, Let It Snow, Let It Snow

Layout Style: S2 Flexible Squares
Features: Semi-Transparent Entries, shaped userpics
Layout Width: Flexible

{ Preview } { Live }
Credit:

layout_lounge

Theme and Layout Change Tutorial

All Fonts Embeded From Google Fonts

/*--------------------------------
S2 Flexible Squares
Layout by http://community.livejournal.com/layout_lounge/
PLEASE DO NOT REMOVE THIS SECTION 
----------------------------------*/
body{
 background-color: #52656B;
 background-image: url(SNOW, if don't use erase this text), url(BACKGROUND IMAGE);
 background-repeat: repeat, repeat;
 background-attachment: fixed, fixed;
 background-size: none, none;
background-position: left bottom, center top;
 color: #717171;
 font-family: "lucida grande", "lucida sans", trebuchet ms, arial, sans-serif;
 font-size: 12px;
 margin: 10px 0 20px 0;
 }

a, a:link, a:visited { color: #e1276b; }
a:hover { color: #444444; }

blockquote {
 width: 70%;
 background-color: #FFFFFF;
 margin-left: 75px;
 padding: 0px 10px 10px 10px; 
 border: 2px dashed #cccccc; 
 color: #333333;
 font-size: 15px;
 line-height: 16px;
 font-family: "trebuchet ms", arial, sans-serif;
 text-align: left;
 }

img.special, i img { background-color: transparent !important; margin: 5px; border: 1px solid #cccccc; padding: 5px;
}

b, strong { color: #4E6885; }
i, em { color: #4c228a; }
u { color: #8CB53F; }
s, strike { color: #AD5C00; }

.b-repost-item { display:none }

p, td{  }
 
code, kbd, pre, tt {font-family: "monospace"; }
 
ul.ljtaglist { width: 95%; text-align: left; padding-left: 5px; margin-left: 10px; }

/*--------------General------------*/
#content {   
 width: 99%; 
 margin-left: auto; 
 margin-right: auto;  
 text-align: left;
 padding: 0px;
 background-color: transparent !important;
 }

#maincontent {
 width: 50%;
 float: left;
 margin: -10px 0px 0px 400px;
 font-family: "trebuchet ms", arial, trebuchet ms, sans-serif;
 font-size: 12px;
 color: #000000;
 text-align: center;
 }

.subcontent {
 margin: 10px 0px 15px 10px;
background-color: rgba(255, 255, 255, 0.85);  
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
 }

/*---------------Header--------------*/
#header {  
 position: relative;
 width: 48.5%;
 height: 20px;
 text-align: center;
 color: #717171;
 padding: 6px 10px 10px 0px;
 margin: -8px 0px 10px 410px;
 font-family: verdana, arial !important;
 font-size: 11px !important;
 letter-spacing: 1px;
 text-transform: lowercase;
 font-weight: none;
 background-color: rgba(0, 0, 0, 0.7);
}

div#header a, div#header a:link, div#header a:visited,

div#header a, div#header a:link, div#header a:visited, div#header a:active {
padding: 12px 10px 11px 10px;
margin: 0px -8px 0 -7px;
 font-family: verdana !important;
 letter-spacing: 1px;
 color: #ffffff;
 text-align: center;
 border-right: 1px solid #666666;
 border-left: 1px solid #666666;
}

div#header li.view { 
 color: #86C3BC;
padding: 12px 10px 11px 10px;
margin: 0px -8px 0 3px;
 border-right: 1px solid #666666;
 border-left: 1px solid #666666;
 }

div#header a:hover {
 color: #86C3BC;
 border-right: 1px solid #666666;
 border-left: lpx solid #666666;
 }

ul.navheader {
 list-style: none;
 line-height: 24px;
 margin: 0;
 padding: 0;
 border-left: lpx solid #666666;
 }

ul.navheader li  {
 display: inline;
 list-style: none;
 border-left: lpx solid #666666;
 }
 
.title, .subtitle { display: none; }

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

.lj-view-recent #footer, .lj-view-friends #footer {
bottom: 5px;
padding:5px 0;
position:fixed;
right:0;
text-align:left;
text-transform:lowercase;
width:100%;
z-index:0;
}

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

ul.navfooter a {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); 
}

ul.navfooter li + li a {
float:right;
background-color: #272727; }

ul.navfooter li + li a:hover { background-color:#9CD0CC !important; }

.lj-view-recent #footer a, .lj-view-friends #footer a, .lj-view-recent #footer a:link, .lj-view-friends #footer a:link {
background-color: #999999;
color: #ffffff;
font-family: open sans condensed, georgia,arial,sans-serif;
font-size: 13px;
padding: 10px;
margin-left: 280px;
}

.lj-view-recent #footer a:hover, .lj-view-friends #footer a:hover {
color:#FFFFFF;
background-color: #9CD0CC;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
padding-right: 5px;
border-left: 4px solid #333333;
letter-spacing: 3px;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); 
}

ul.navfooter li {
list-style:none outside none;
margin:0;
padding:0;
display:inline; }

ul.navfooter li + li {
list-style:none outside none;
margin:0;
padding:0;
display:inline;  }

#footer .viewing { display:none; }

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

#sidebar {
 float: left;
 position: fixed;
bottom: 0; left: 0;
 padding: 0px 0 10px 0; 
background-color: #ffffff;  
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5); 
margin: -20px 10px 0px 0px;
 font-family: open sans condensed, arial, georgia;
 font-size: 11px;
 color: #717171;
 width: 280px;
 text-align: left;
 text-transform: normal;
right: 5px;
height: 90%;
overflow-x: hidden; overflow-y: auto;
 }

.sbarbody2 { 
padding: 5px; 
background-color: #F3F3F3; 
margin-top: 0px; 
margin: 0 8px 0 5px; 
line-height: 12px; 
 font-family: "trebuchet ms", arial, sans-serif;
font-size: 11px !important; 
text-transform: lowercase; 
text-align: right;
 border: 5px solid #E0E0E0; 
-webkit-box-shadow: 1px -1px 5px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 1px -1px 5px rgba(0, 0, 0, 0.5);
box-shadow: 1px -1px 5px rgba(0, 0, 0, 0.5); }

.sbarbody {
margin: 0 8px 0 5px; 
padding: 0px;
padding-bottom: 5px; 
text-align: center;
}

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

li.sbaritem {
position: inline;
list-style-type: none;
margin-top: 2px;
text-align: left;
}

li.sbaritem a {
color: #8A1751;
display: inline;
 font-family: "trebuchet ms", arial, sans-serif;
font-size: 11px;
font-style: italic;
font-weight: lighter;
margin-right: 0px;
padding: 2px;
text-align: left; }

li.sbaritem a:hover {
color:#444444; -webkit-box-shadow: 1px -1px 5px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 1px -1px 5px rgba(0, 0, 0, 0.5);
box-shadow: 1px -1px 5px rgba(0, 0, 0, 0.5); }

li.sbartitle {
 list-style: none;
 color: #525171; 
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px; -khtml-border-radius: 10px;
text-align: center;
letter-spacing: 2px;
 font-family: "Dancing Script", trebuchet ms, arial, sans-serif;
 font-size: 25px;
 text-transform: normal;
 margin: 1px 5px 1px 5px;
text-shadow: 2px 2px 6px #bbbbbb;
 }

#sidebar_linklist  {
list-style-type:none;
padding-top:2px;
text-align: left !important;
text-transform:lowercase;
height: 100px;
overflow-x: hidden; overflow-y: auto;
}

#sidebar_linklist li.sbaritem a {
color: #81A6A2;
display:block;
 font-family: "trebuchet ms", arial, sans-serif;
font-size: 12px;
font-style:italic;
font-weight:lighter;
margin-right:2px;
padding:2px 5px;
text-align: center;
border-bottom: 1px solid #EDEDED;}

#sidebar_linklist li.sbaritem a:hover {
color:#FFFFFF; 
background-color:#444444;
text-align: right;
letter-spacing: 2px; 
-webkit-box-shadow: 1px -1px 5px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 1px -1px 5px rgba(0, 0, 0, 0.5);
box-shadow: 1px -1px 5px rgba(0, 0, 0, 0.5); 
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px; 
-khtml-border-radius: 5px;}

td.sbarcalendar {background-color:#F3F2EE;
padding: 3px;}

td.sbarcalendarposts {background-color:transparent;
padding: 3px;}

table.calendar {padding-top: 5px;}

#sidebar_summary li.sbaritem {
 color: #717171;
border: 5px solid #E0E0E0; 
background-color: #F3F3F3;
padding: 3px;
text-transform: normal;
margin: 3px 0px;
 }

#sidebar_summary li.sbaritem a {
text-decoration: none;
display: inline !important;
color: #81A6A2;
background-color: transparent !important;
}

#sidebar_summary li.sbaritem a: hover{
text-decoration: none;
color: #717171;
background-color: transparent !important;
-webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.1);
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.1);
}

#sidebar_tags .sbarcontent { height: 100px;         overflow-x: hidden; overflow-y: auto;}

li.tagBox a { color: #81A6A2; display: block; font-family: trebuchet ms,arial,sans-serif; font-size: 11px; font-style: italic; font-weight: lighter; margin-right: 2px; padding-bottom: 2px; padding-left: 5px; padding-right: 5px; padding-top: 2px; text-align: center; }

li.tagBox a:hover { color: #ffffff; background-color:#444444; text-align: right;
letter-spacing: 2px; padding: 2px 5px; 
-webkit-box-shadow: 1px -1px 5px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 1px -1px 5px rgba(0, 0, 0, 0.5);
box-shadow: 1px -1px 5px rgba(0, 0, 0, 0.5); -moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px; 
-khtml-border-radius: 5px;}

#sidebar_tags li.sbaritem a { color: #81A6A2; display: block; font-family: trebuchet ms,arial,sans-serif; font-size: 11px; font-style: italic; font-weight: lighter; margin-right: 2px; padding-bottom: 2px; padding-left: 5px; padding-right: 5px; padding-top: 2px; text-align: center; }

#sidebar_tags li.sbaritem a:hover { color: #ffffff; background-color:#444444; text-align: right;
letter-spacing: 2px; padding: 2px 5px; -moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px; 
-khtml-border-radius: 5px;}

.defaultuserpic, .defaultuserpic image { text-align: center; padding: 10px; margin: 0 0 8px 0; }

/*-----------Entries-----------*/
.entry {
 padding: 10px 20px 10px 20px;
 margin: 0px;
 color: #000000;
 font-family: "Roboto Condensed", calibri, arial, verdana;
 font-size: 14px;
 text-align: left;
 }
 
hr { color: transparent; height: 1px; border-bottom: 1px solid #cccccc; }

.entry ul li, ol li, li {
 padding-left: 5px;
 margin-left: 5px;
 list-style: normal;
 list-style-position: outside;
 }

.userpic, .userpicfriends {
 postition: relative;
 float: left;
 margin: -25px 15px 25px -110px;
 padding: 10px;
 width: 100px;
 height: 100px;
 text-align: center;
 color: #222222!important; 
 background: #FFF!important;
 -webkit-border-radius: 5px 60px 5px 60px;
 -moz-border-radius: 5px 60px 5px 60px;
 -ms-border-radius: 5px 60px 5px 60px;
 -o-border-radius: 5px 60px 5px 60px;
 border-radius: 5px 60px 5px 60px;
 -webkit-box-shadow: #CCC 0 0 5px;
 -moz-box-shadow: #CCC 0 0 5px;
 -ms-box-shadow: #CCC 0 0 5px;
 -o-box-shadow: #CCC 0 0 5px;
 box-shadow: #CCC 0 0 5px;
 }

.userpic img, .userpicfriends img {
 width: 100px;
 height: 100px;
 -webkit-border-radius: 5px 50px 5px 50px;
 -moz-border-radius: 5px 50px 5px 50px;
 -ms-border-radius: 5px 50px 5px 50px;
 -o-border-radius: 5px 50px 5px 50px !important;
 border-radius: 5px 50px 5px 50px;
}
 
.userpicfriends a, .userpicfriends font {
 float: center;
 font-family: 'Roboto Condensed', sans-serif;
 font-size: 12px;
 text-align: center;
 color: #81A6A2;
 -webkit-border-radius: 5px;
 -moz-border-radius: 5px;
 -ms-border-radius: 5px;
 -o-border-radius: 5px;
 border-radius: 5px;
 }
 
.userpicfriends a:hover, .userpicfriends a font:hover {color: #bbbbbb;  text-shadow: 2px 2px 6px #bbbbbb; }

.date  {
 margin: 0px 10px -5px 10px;
 padding-top: 20px;
 text-align: center; 
 padding-right: auto;
 padding-left: auto;
 color: #ccccca;
 font-family: "arial", sans-serif;
 font-size: 10px;
 text-transform: normal;
}

.subject {
 padding: 0px 0px 5px 5px;
 margin: 10px 10px 0px 10px;
 color: #4E6885;
font-family: "Dancing Script", open sans condensed, georgia, arial;
 font-size: 26px;
 font-weight: normal; 
 text-align: left;
 text-transform: normal;
text-shadow: 2px 2px 6px #bbbbbb;
 }
 
.subject a, .subject a:link, .subject a:visited {color: #4E6885;}

.subject a:hover {color: #565656;}

.datesubject {
 background-color: transparent;
 padding: 0px;
 text-align: left;
 }

span.ljuser a b {
 padding: 2px 0 2px 0;
 color: #e1276b;
 font-weight: normal;
 font-size: 12px;
 }

span.ljuser a:hover b {
 padding-top: 2px;
 padding-bottom: 2px;
 color: #717171;
 font-weight: normal;
 font-size: 12px;
 }

/*-----Currents, tags, comment links-----*/

.ljtags {
 margin-top: 5px;
 color: #bbbbbb;
 font-weight: lighter;
 font-size: 10px;
 font-family: "Verdana", arial;
 text-transform: lowercase;
 margin: 15px 0px 0px 0px;
 padding: 5px 0px 5px 17px;
 background: URL(http://i31.tinypic.com/15p046e.jpg) no-repeat center left;
 }
 
.currents strong, .currentmood strong, .currentmusic .currentlocation,

.ljtags strong {
 font-family: "Verdana", arial;
 font-size: 12px;
 color: #bbbbbb;
 font-weight: lighter;
 text-transform: lowercase;
 }

.currents, .currentmood, .currentmusic, .currentlocation {
 font-family: "trebuchet ms", arial;
 font-size: 10px;
 color: #717171;
 font-weight: lighter;
 text-transform: lowercase;
 }

.ljtags a, .ljtags a:link, .ljtags a:visited {
 font-family: "trebuchet ms", arial;
 font-size: 12px;
 line-height: 150%;
 color: #81A6A2;
 text-transform: lowercase;
 font-weight: lighter;
 padding: 3px;
 }

.currentlocation a, .currentlocation a:link, .currentlocation a:visited {
 font-family: "trebuchet ms", arial;
 font-size: 10px;
 color: #81A6A2;
 text-transform: lowercase;
 font-weight: lighter;
 }
 
.currentlocation a:hover, .ljtags a:hover {
 font-family: "trebuchet ms", arial;
 font-size: 12px;
 color: #717171;
 font-weight: lighter;
 text-transform: lowercase;
 }

.comments {
 font-family: "Wire One", open sans condensed, georgia, arial;
 font-size: 16px;
 font-weight: none;
 color: #ffffff;
 text-align: center;
padding: 5px;
 position: relative;
 bottom: 0;
 clear: center;
 margin-top: 5px;
 text-transform: uppercase;
 }
 
div.comments a, div.comments a:link, div.comments a:visited{
color:#81A6A2;
font-family: open sans condensed, arial !important;
 font-size: 14px !important; line-height: 130%; 
line-height:1;
margin:0;
padding: 5px 2px 5px 5px;
letter-spacing: 3px;
text-align: center;
 }

div.comments a:hover { color:#717171;
letter-spacing: 3px;
padding: 5px 2px 5px 5px;
}

/*------------Comments Page--------*/
.box {
 padding: 5px 5px 5px 10px;
 margin-left: 9px;
 text-align: left;
 clear: left;
 background-color: rgba(255, 255, 255, 0.8);
 width: 96%;
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
 }

form div.box {
 text-align: left;
 width: 96%;
  }

.skiplinks {
 background-color:  rgba(255, 255, 255, 0.85);
 text-align: center;
 font-family: "trebuchet ms", arial;
 padding: 12px;
 margin: 5px 0 0 10px;
 font-size: 12px;
 letter-spacing: 1px;
 color: #999999;
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 10px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 10px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 10px rgba(0, 0, 0, 0.5);
 }

.datesubjectcomment {
 margin-top: 10px;
 text-align: left;
 padding: 5px;
 font-size: 12px;
 color: #000000;
 border-bottom: 1px solid #cccccc;
 }

.datesubjectcomment a:link, .datesubjectcomment a:visited {color: #8A1751; font-family: Roboto Condensed, trebuchet ms, arial !important; font-size: 11px;  text-shadow: 2px 2px 6px #bbbbbb; }
 
.datesubjectcomment a:hover {color: #d60014;  font-family: Roboto Condensed, trebuchet ms, arial !important; font-size: 11px;  text-shadow: 2px 2px 6px #ffffff; }

.userpiccomment {
 margin: 0px;
 padding: 10px;
 width: 100px;
 height: 100px;
 float: right;
 background: #FFF!important;
 -webkit-border-radius: 5px 60px 5px 60px;
 -moz-border-radius: 5px 60px 5px 60px;
 -ms-border-radius: 5px 60px 5px 60px;
 -o-border-radius: 5px 60px 5px 60px;
 border-radius: 5px 60px 5px 60px;
 -webkit-box-shadow: #CCC 0 0 5px;
 -moz-box-shadow: #CCC 0 0 5px;
 -ms-box-shadow: #CCC 0 0 5px;
 -o-box-shadow: #CCC 0 0 5px;
 box-shadow: #CCC 0 0 5px;
}

div#content input,
div#content textarea,
div#content select {
 width: 80%;
 color: #717171;
 padding: 10px;
 marging: 10px; 
 border: 1px solid #cccccc;
 background-color:#ffffff;
 -webkit-box-shadow: #CCC 0 0 5px;
 -moz-box-shadow: #CCC 0 0 5px;
 -ms-box-shadow: #CCC 0 0 5px;
 -o-box-shadow: #CCC 0 0 5px;
 box-shadow: #CCC 0 0 5px;}
 }
 
textarea.textbox  {width: 90% !important;  -webkit-border-radius: 20px;
 -moz-border-radius: 20px;
 -ms-border-radius: 20px;
 -o-border-radius: 20px;
 border-radius: 20px;
 -webkit-box-shadow: #CCC 0 0 5px;
 -moz-box-shadow: #CCC 0 0 5px;
 -ms-box-shadow: #CCC 0 0 5px;
 -o-box-shadow: #CCC 0 0 5px;
 box-shadow: #CCC 0 0 5px;}

.reply {
 position: relative;
 margin: 20px 30px 10px 30px;
 padding: 25px 10px 10px 10px;
 text-align: left;
 font-family: "trebuchet ms", arial, trebuchet ms, sans-serif;
 font-size: 10px;
 line-height: 125%;
 color: #717171;
 }
 
.replytosubject {
 text-transform: normal;
 padding: 5px;
 }

.replytoposter {
 background-color: #ffffff;
 color: #8A1751;
 text-transform: normal;
 padding: 5px;
 }

.commentreply {
 text-align: left;
 position: relative;
 margin: 11px;
 font-family: "Roboto Condensed", arial, trebuchet ms, sans-serif;
 font-size: 13px;
 color: #717171;
 }
 
.commentbox {
 padding: 5px;
 margin: 10px 10px 10px 20px;
 text-align: left;
 background-color: #ffffff;
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 5px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 5px rgba(0, 0, 0, 0.5);
 }

.commentboxpartial {
 padding: 10px; 
 margin: 10px; 
 background-color: #ffffff;
 }

.commentinfo {
 margin-top: 10px; 
 width: 100%;
 }

/*-----------Year/Archive Page----------*/

ul.year {  width: 97%; text-align: center;  padding: 5px; margin-left: 10px;     background-color: #ffffff;   -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5); }

ul.year li {display: inline;}

table.yeartable { width: 98%; margin-left: auto; margin-right: auto; margin-right: 5px; padding: 20px 100px 20px 100px; background-color: #ffffff;   -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5); }

table.yeartable td.yeardate, table.yeartable td.yearday { border: 1px solid #cccccc; color: #717171; }

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

td.yearmonth { color: #717171; border-style: none; }

/*-----------Tags Page---------*/

ul.ljtaglist {
 color: #717171;
 font-family: "trebuchet ms", arial, trebuchet ms, sans-serif;
 font-size: 12px;
 padding: 8px 8px 8px 20px;
 background-color: #ffffff;
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5);
 }

ul.ljtaglist li  {list-style: normal;}

/*----------SECTION: Tiny Icons----------*/
.currentlocation {
 background: url(http://i54.tinypic.com/msm1c0.jpg) no-repeat left center;
 padding: 2px 0px 5px 18px;
 }

.currentmood  {
 background: url(http://i32.tinypic.com/2vhsnxy.jpg) no-repeat left center;
 padding: 2px 0px 5px 18px;
 }

.currentmusic {
 background: url(http://i26.tinypic.com/2nv6qtf.jpg) no-repeat left center;
 padding: 2px 0px 5px 18px;
 }

.currentgroups {
 background: url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/fugue/foaf.png) no-repeat left center;
 padding: 2px 0px 5px 18px;
 }

/* PROTECTED ENTRY */
.subject img[src*="icon_protected.gif"]{
 width: 0;
 height: 0;
 padding: 16px 0px 0 16px;
 background: URL(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/fugue/lock-unlock.png) no-repeat !important; 
 }

/* FRIENDS GROUP */
.subject img[src*="icon_groups.gif"]{
width: 0; height: 0; padding: 0 16px 16px 0; background: url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/fugue/foaf.png) no-repeat !important; }

/* PRIVATE ENTRY */
.subject img[src*="icon_private.gif"]{
 width: 0;
 height: 0;
 padding: 16px 0px 0 16px;
 background: URL(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/fugue/lock.png) no-repeat !important; 
 }

/* USER */
html body .ljuser img {
 width: 0 !important;
 height: 0 !important;
 background-repeat: no-repeat;
 background: transparent url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/santa-hat.png~original) no-repeat 0 0 !important;
 padding: 16px 0px 0px 16px !important;
 }

html body .ljuser img[src*="userinfo.gif"] {
 width: 0 !important;
 height: 0 !important;
 background: transparent url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/santa-hat.png~original) no-repeat 0 0 !important;
 padding: 16px 0px 0px 16px !important;
 }

/* COMMUNITY */
html body .ljuser img[src*="community.gif"] {
 width: 0 !important;
 height: 0 !important;
 background: transparent url(http://i77.photobucket.com/albums/j49/SireesAnwar/TinyIcons/christmas-tree.png) no-repeat 0 0 !important;
 padding: 16px 0px 0px 16px !important;
 }

/*-----------Mics-----------*/
.clear { height: 0px; font-size: 0.01px; }
 
#lj_controlstrip_statustext {
 color: #999999;
 font-size: 12px;
 font-weight: bold;
 }

#lj_controlstrip td {
 font-family: "georgia" !important;
 font-size: 12px;
 background-color: #000000 !important;
 border: 0px solid #999999;
 }

#lj_controlstrip a, #lj_controlstrip a:visited {
 font-family: "georgia" !important;
 font-size: 11px;
 color: #999999 !important;
 text-transform: lowercase;
 }

#lj_controlstrip a:hover { color: #6DA9C1 !important; }

@font-face {
  font-family: 'Wire One';
  font-style: normal;
  font-weight: 400;
  src: local('Wire One'), local('WireOne'), url(http://themes.googleusercontent.com/static/fonts/wireone/v3/fas9dl2wmMkt5rCu-aBez_esZW2xOQ-xsNqO47m55DA.woff) format('woff');
}

@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Roboto Condensed Light'), local('RobotoCondensed-Light'), url(http://themes.googleusercontent.com/static/fonts/robotocondensed/v8/b9QBgL0iMZfDSpmcXcE8nNeiznanRB67rGZDYkMvKPc.woff) format('woff');
}
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Condensed Regular'), local('RobotoCondensed-Regular'), url(http://themes.googleusercontent.com/static/fonts/robotocondensed/v8/Zd2E9abXLFGSr9G3YK2MsFzqCfRpIA3W6ypxnPISCPA.woff) format('woff');
}

@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 400;
  src: local('Dancing Script'), local('DancingScript'), url(http://themes.googleusercontent.com/static/fonts/dancingscript/v3/DK0eTGXiZjN6yA8zAEyM2VhlQWQpSCpzb2Peu3I-Q34.woff) format('woff');
}

@font-face {
  font-family: 'Fredericka the Great';
  font-style: normal;
  font-weight: 400;
  src: local('Fredericka the Great'), local('FrederickatheGreat'), url(http://themes.googleusercontent.com/static/fonts/frederickathegreat/v2/7Es8Lxoku-e5eOZWpxw18vc3vBAn7YvtW9hNjxWZBR0.woff) format('woff');
}

.headerimage {
 position: relative;
 width: 0px;
 height: 0px;
 margin-left: 300px;
 margin-right: auto;
 margin-bottom: 10px;
 padding: 0px;
 background-color: transparent !important;
 background-image: url(HEADER IAMGE);
}

.separator { height: 10px; }

Images As They Appear In Coding:

Body Background:

Header Image Background: None in this layout. Coding towards the end. Make sure to make the width and height the same as your image.

Notes:
.headerimage coding at the bottom and follow instructions on the Multiple Backgrounds Tutorial.

Width of journal entries, comments and other components is by percentage to make it flexible. There may be adjustments required for the resolution or width of your screen.

More Images:
More Background Images: Layout Lounge Site
More Tiny Icons: Layout Lounge Site

RULES:
No Hotlinking Images #4 under general
Header can be changed
Background image can be changed or removed.
Credit Necessary.

Having Trouble? Check out the Theme and Layout Change Tutorial.
If that didn't work. Comment.

Flat | Top-Level Comments Only

From:

sexycazzy.livejournal.com

~~Hi I would like to use the animated snow on my current livejournal and tried to add it using your code under the body section but didn't seem to have worked?~~

I decided to change the layout and used your layout but I wanted to add the header to your layout, however, the header seems to be off...how can I fix it? Hope you can help? Thanks!

Edited Date: 2013-12-18 12:15 am (UTC)

sireesanwar.livejournal.com

Replace with the coding that I posted at
http://workshop-rees.livejournal.com/17006.html

Thank you! I really appreciate you taking the time to fix the code for me! :)

No problem!

kseenaa.livejournal.com

That looks gorgeous!

Thank you!

I am thinking off using this, but I don't want the animated snow, just the christmas-trees. :-) Is there a way to that? *curiuos* Anything I need to delete in the code? Or change?

Just in the background coding where it says you put the snow url just leave it blank "url()".

No snow.

Never mind, I figured it out! :-D THank you for letting me use it!

Okay. I commented anyway... someone might need the same help.

laoracci.livejournal.com

thank you so much <3

Welcome!

daisuchii.livejournal.com

Im going to change my theme and use this ^^ Thank you very much <3 BTW, this is so gorgeous :3

Thank you very much. Enjoy.

enmachin.livejournal.com

thank you so much for the pretty layout~ I'm using it ^^
I've got something to ask though. What should i do if i want to have the sidebar to be scrollable as a whole only and not every section?

The sidebar is currently scrollable but if you want to turn off the scroll features for links and tags you'll have to find the coding in the sidebar section.

You'll see that the height on the tag and links are set to a specific height. Just change that height to 100%.

got it! thanks a lot. :D

Great!

Layout Lounge

Layouts, Tutorials, Help, and more

82. Let It Snow, Let It Snow, Let It Snow

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

(no subject)

About

Links

Tags

Summary

April 2025