layoutlounge | 81. Shaded Glory

Layout Style: S2 Flexible Squares
Features: large background image, custom userpics, entry shadow, entry shading
Layout Width: 1000px
Inspired by:

mintyapple

{ Preview } { Preview 2 } { Live }
Credit:

layout_lounge

Theme and Layout Change Tutorial

All embedded in coding 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(), url(Background image here);
 background-repeat: no-repeat, no-repeat;
 background-attachment: fixed, fixed;
 background-size: cover, cover;
background-position: left bottom, center bottom;
 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: #81A6A2; }
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 { text-align: left; padding-left: 5px; }

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

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

.subcontent {
 margin: 10px 0px 15px 0px;
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);
 }

/*---------------Header--------------*/
#header {  
 position: inherit;
 width: 1000px;
 height: 40px;
 text-align: center;
 color: #282828;
 padding: 30px 0 0 0px;
 margin: 0 0 10px;
font-family: "Dancing Script", Fredericka the Great, open sans condensed, georgia, arial;
  font-size: 20px !important; line-height: 100%;  
 letter-spacing: 1px;
 text-transform: normal;
 font-weight: bold;
}

div#header a, div#header a:link, div#header a:visited, div#header a:active {
 padding: 5px;
 margin: 0px 1px 10px 1px;
 letter-spacing: 1px;
 color: #ffffff;
 text-align: left;
 border:0px solid #E0E0E0;
 text-shadow: 0px 0px 10px #000000;
}

div#header li.view { 
 padding: 5px;
 margin: 0px 1px 10px 1px;
 color: #f7f7f7;
 text-shadow: 0px 0px 10px #000000;
 }

div#header a:hover { 
 color: #4E6885;
 }

ul.navheader {
 list-style: none;
 line-height: 24px;
 margin: 0;
 padding: 0;
 }

ul.navheader li  {
 display: inline;
 list-style: none;
 }
 
.title, .subtitle { display: none; }

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

.lj-view-recent #footer, .lj-view-friends #footer {
bottom: 10px;
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:#4E6885 !important; }

div#footer a, div#footer a:link {
background-color: #999999;
color: #ffffff;
font-family: open sans condensed, georgia,arial,sans-serif;
font-size: 13px;
padding: 10px;
}

.lj-view-recent #footer a:hover, .lj-view-friends #footer a:hover {
color:#FFFFFF;
background-color: #4E6885;
-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 {
 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-left: 10px;
 margin-right:-10px;
 font-family: open sans condensed, arial, georgia;
 font-size: 11px;
 color: #717171;
 width: 260px;
 float: right;
 text-align: left;
 text-transform: normal;
right: 5px;
 }

.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;}

#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: #717171;
 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 -100px;
 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: #81A6A2;
 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: 20px;
 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: 0px;
 text-align: left;
 clear: right;
 background-color: rgba(255, 255, 255, 0.8);
 width: 700px;
  -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: 700px;
  }

.skiplinks {
 background-color: #ffffff;
 text-align: center;
 font-family: "trebuchet ms", arial;
 padding: 12px;
 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 {  text-align: center;  padding: 5px;         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: 720px; margin-left: auto; margin-right: auto; 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/1373793749_ballooning.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/1373793749_ballooning.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/weather_sun.png~original) 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; }

.headerimage {
 position: relative;
 width: 1000px;
 height: 0px;
 margin-left: auto;
 margin-right: auto;
 margin-top: 0px;
 padding: 0px;
 background-color: transparent !important;
 background-image: url(http://i77.photobucket.com/albums/j49/SireesAnwar/graffitigraphic-stock0763.png);
  -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);
}

.separator { height: 20px; }

@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');
}

Images As They Appear In Coding:

Body Background:

(this image you will want to change the background-color for the body to #ffffff)

Header Image Background: No header image currently but the coding is near the bottom. The width should be about 1000px and you will have to make the height the same as whatever image you use.

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

More Headers:
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:

bomchii-97.livejournal.com

Hi ^^
Thanks for sharing this wonderful layout and I already tried working on it but I have problems with the background image. Even if i placed the correct links it just wont appear on the background all I can see is just a plain solid color background. And as soon as i add the header image (using the instructions on the fixed header image) and the whole setting just dissappear. What should I do??

Sorry for the inconveniences...

sireesanwar.livejournal.com

Send me links to the background and header images you want and I'll code it so you can copy and paste.

This is for the background
http://i1082.photobucket.com/albums/j378/dolleyesageha/fanfic%20project/tumblr_n11j9mC96l1rgqhigo1_500_zps8801d95d.jpg

And this is for the header
http://i1082.photobucket.com/albums/j378/dolleyesageha/fanfic%20project/tumblr_n0vxt6taYx1rgqhigo1_500_zps8ef4ac33.jpg

Thanks so much, and I'm sorry for the trouble...

No problem.

Okay check it out over at

workshop_rees.

I put the coding in the first post though it seems your background looks off to me. If you don't like it you can swap it out for something else.

Edited Date: 2014-02-18 07:56 pm (UTC)

Thanks so much. I saw what you did and it really is what I want to see but unfortunately when I pasted it on my Custom CSS section and save it without doing anything on the code I still got blank background and header... :( I'm sorry for being such a trouble...

It is okay. Something is clearly wrong here and I'm not sure what it is. If I could see the problem in action I might be able to figure it out.

Okay, If this helps, this is my journal you can see the problem for yourself since I'm already using your layout. I'm really sorry for the trouble.
http://munchingkyumin.livejournal.com/

Okay so I'm a little stumped. I don't get why it isn't working.

So what I'm going to suggest is this... where you go to put in the code. Hit the Reset to Default and then go to the below tutorial to do a reset up and then add the coding into the CSS box (when choosing Flexible Squares pick the Autumn Layout to add the CSS to). See if that fixes anything. I have updated the code a little at

workshop_rees.
http://layout-lounge.livejournal.com/8638.html

Let's see if this works.

Edited Date: 2014-02-20 10:30 pm (UTC)

Oh my god. I didn't know if you work on my layout already but thanks so much. It's okay now. The background and the header finally showed up. Thank you thank you so much ^^

I did go in but then LJ locked me out of my account so I couldn't get back in to tell you I fixed it. The weird thing is that I really didn't do anything. I just pasted the code in and it worked.

That just doesn't make much sense to me because I saw the coding you had which was the same. Really confusing but I'm glad it is working now.

YEah, that's too weird. Hehe Anyways thanks so so so much for the wonderful layouts and for helping me a lot. Looking forward to your new layouts. Thanks again ^^

No problem. I'm just glad we got it all figured out.

Layout Lounge

Layouts, Tutorials, Help, and more

81. Shaded Glory

(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