S2 Flexible Squares [Vintage 2.0 revisited]

Aug 20, 2008 22:00


Somebody asked me to make a different color scheme for Vintage 2.0. Here it is. Among some variations.



Live preview | Image preview





Live preview | Image preview
/********************DO NOT REMOVE THIS******************** Layout 002 [Vintage 2.0] by Yam @ Frozen Mint (frozen_mint.livejournal.com) Style: Flexible Squares Account level: Basic / Paid / Plus Tested on: IE (6 and higher), Firefox, Safari and Chrome ************************************************************/ /*****BASICS ************/ body { background:#eb8fd7; font-family:"Trebuchet MS", Verdana, Helvetica, sans-serif; color:#808080; font-size:100%; } a, a:link, a:visited { color:#4ac87b; text-decoration:none; text-transform:none; } a:hover { color:#ec91d8; text-decoration:underline; } blockquote { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/head-green.png) top left repeat-x; border:1px solid #4ac87b; color:#808080; text-align:left; margin:auto; padding:10px; width:95%; } p, td { font-size:inherit; } code, kbd, pre, tt { font-family:monospace; } ::-moz-selection { background:#ec91d8; color: #666; } b, strong{ font-weight:bold; color:#4ac87b;} i, em{ font-style:italic;} .ippu {font-size:11px;} a{outline:none;} a img{border:0;} /*****LAYOUT ************/ #header { font-family:"Lucida Sans", "Trebuchet MS", Verdana, Helvetica, sans-serif; background-color:#f9f9f9; margin:0; padding:15px 10px; text-align:left; width:auto; } #content { background:#f9f9f9; border:1px solid #cacaca; width:850px; margin-left:auto; margin-right:auto; margin-top:30px; padding: 0px; height:100%; } #sidebar { background:#f9f9f9; font-size:0.6875em/*11px*/; float:left; margin: 0 0 10px 0; padding: 0 15px 5px 15px; text-align: left; width: 200px; } #maincontent { background:#f9f9f9; margin: 0 0 0 240px; font-size:0.75em/*12px*/; } #footer { font-family:"Lucida Sans", "Trebuchet MS", Verdana, Helvetica, sans-serif; background-color:#f9f9f9; margin:auto; padding:15px 10px; text-align:left; } /*****HEADER ************/ ul.navheader { padding:0; margin:0; } ul.navheader li { display:inline; list-style:none; padding:0; margin:0; } #header li.view { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/head-pink.png) top left repeat-x; border:1px solid #ec91d8; color:#808080; font-size:0.75em/*12px*/; letter-spacing:0.1em; text-transform:uppercase; text-decoration:none; margin:0; padding:5px 10px; } #header a, #header a:link, #header a:visited { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/head-green.png) top left repeat-x; border:1px solid #4ac87b; color:#808080; font-size:0.75em/*12px*/; letter-spacing:0.1em; text-transform:uppercase; margin:0; padding:5px 10px; } #header a:hover { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/head-pink.png) top left repeat-x; border:1px solid #ec91d8; color:#7a7979; font-size:0.75em/*12px*/; letter-spacing:0.1em; text-transform:uppercase; text-decoration:none; margin:0; padding:5px 10px; } .title, .subtitle { display:none; } /*****SIDEBAR *************/ div#sidebar a, div#sidebar a:link, div#sidebar a:visited { color:#666; text-decoration:none; text-transform:uppercase; } div#sidebar a:hover { color:#4ac87b; text-decoration:none; } .sbarbody { padding:0; margin:0; } .sbarbody2 { background-color:#f9f9f9; padding:0; } .defaultuserpic { display:none; margin:auto; text-align:center; } table.calendar { margin:auto; width:100%; } .sbarcalendar { background:#fff; border:1px solid #dbdbdb; color: #808080; font-size:1em/*12px*/; padding:1px; text-align:center; } .sbarcalendarposts { background:#cacaca; border:1px solid #cacaca; font-size:1em/*12px*/; padding:1px; text-align:center; } .sbarcalendarposts a, .sbarcalendarposts a:link, .sbarcalendarposts a:visited{ color:#fff!important; } .sbarcalendarposts a:hover{ color:#fff; text-decoration: underline!important; } ul.sbarlist { list-style:none; margin:0; padding:0; } li.sbaritem { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/head-gray.png) top left repeat-x; border: 1px solid #dbdbdb; color:#666; text-decoration:none; text-transform:none; text-align:left; padding:5px; margin:2px; } #sidebar_linklist li.sbaritem a, #sidebar_tags li.sbaritem a{ display:block; } #sidebar_linklist li.sbaritem:hover, #sidebar_tags li.sbaritem:hover{ display:block; background:#f9f9f9; border:1px solid #cacaca; color:#666; } #sidebar_summary li.sbaritem { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/head-gray.png) top left repeat-x; border: 1px solid #dbdbdb; display:block; color:#666; text-decoration:none; text-transform:none; text-align:left; padding:5px; margin:2px; } #sidebar_summary li.sbaritem:hover{ display:block; background:#f9f9f9; border:1px solid #cacaca; color:#666; } li.sbartitle { list-style:none; color:#808080; font-size:1.1818em/*13px*/; margin:15px 0 0 0; padding:0; text-align:left; text-transform:uppercase; } /*ul.ljtaglist li {list-style: none;} .sbarheader {}*/ /*****FOOTER ************/ ul.navfooter { padding:0; margin:auto; } ul.navfooter li { display:inline; list-style:none; padding:0; margin:auto; } #footer li.viewing { background-color:#f9f9f9; color:#808080; font-size:0.75em/*12px*/; letter-spacing:0.1em; text-transform:uppercase; text-decoration: none; margin:5px; padding:5px; } #footer a, #footer a:link, #footer a:visited { background-color:#f9f9f9; color:#4ac87b; font-size:0.75em/*12px*/; letter-spacing:0.1em; text-transform:uppercase; margin:5px; padding:5px; } #footer a:hover { background-color:#f9f9f9; color:#ec91d8; font-size:0.75em/*12px*/; letter-spacing:0.1em; text-transform:uppercase; text-decoration:underline; margin:5px; padding:5px; } /*****ENTRY ***********/ .subcontent { background:#f9f9f9; border-left:1px solid #f0f0f0; margin:5px; padding:5px; } .entry{ color:#808080; margin:0; padding:5px; text-align:left; } .entry ul li { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/entry-li-arrow.gif) left no-repeat; list-style:none; margin-left:10px; padding-left:11px; color:#808080; } .entry ol li { list-style:lower-roman; margin-left:30px; padding-left:0px; color:#808080; } /*****USERPICS **************/ .userpic, .userpicfriends { background:#fff!important; border: 1px solid #dbdbdb; font-size:0.7692em/*10px*/; text-align:center; text-transform:lowercase; color:#4ac87b; float:right; margin:0 15px 15px 15px; padding:5px; position:relative; z-index:15; } .userpicfriends font{ font-size:1em/*10px*/; text-align:center; text-transform:lowercase; color:#808080; } .userpic a, .userpic a:link, .userpic a:visited, .userpicfriends a, .userpicfriends a:link, .userpicfriends a:visited, userpicfriends font{ color:#808080!important; text-decoration: none; text-transform:lowercase; } .userpic a, .userpicfriends a:hover, userpicfriends a:hover font { color:#808080!important; text-decoration:underline; text-transform:lowercase; } /*.userpicfriends br {}*/ /*****DATE, SUBJECT, CURRENTS GENERAL, COMMENTS, TAGS ***************************************/ .date{ border:0px; color:#808080; font-size:0.9166em/*11px*/; text-align:left; text-transform:lowercase; } .subject { color:#ec91d8; font-family:"Lucida Sans", "Trebuchet MS", Verdana, Helvetica, sans-serif; font-size:1.3333em/*16px*/; text-align:left; text-transform:uppercase; font-style:normal; font-weight:bold; border-bottom:1px solid #dbdbdb; } .subject a, .subject a:link, .subject a:visited { color:#ec91d8; text-transform:uppercase; font-style:normal; font-weight:bold; } .subject a:hover { color:#ec91d8; text-decoration:underline; } .datesubject { background-color:#f9f9f9; padding:10px; } .ljtags { border-left:2px solid #ec91d8; padding-left:5px; text-align:left; margin-top:10px; color:#808080; font-size:0.9166em/*11px*/; font-weight:normal; } .currents{ border-left:2px solid #ec91d8; padding-left:5px; text-align:left; color:#808080; font-size:0.9166em/*11px*/; } .currents strong, .ljtags strong { color:#808080; font-weight:normal; } .ljtags a, .ljtags a:link, .ljtags a:visited, .currents a, .currents a:link, .currents a:visited { color:#4ac87b; font-weight:normal; } .ljtags a:hover, .currents a:hover { color:#ec91d8; text-decoration:underline; } .comments { border-left:2px solid #ec91d8; padding-left:5px; position: relative; background:#f9f9f9; color:#ec91d8; font-family:"Lucida Sans", "Trebuchet MS", Verdana, Helvetica, sans-serif; font-size:1em/*12px*/; letter-spacing:0.05em; text-align:left; text-transform:uppercase; font-style:normal; font-weight:bold; margin-bottom:10px; } .comments a, .comments a:link, .comments a:visited { color:#4ac87b; text-transform:uppercase; } .comments a:hover { color:#ec91d8; text-decoration:underline; } /*****TAGS PAGE **************/ .ljtaglist { width:80%; list-style:none; color:#808080; border-left: 1px solid #f0f0f0; } .ljtaglist li { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/entry-li-arrow.gif) left no-repeat; border-bottom: 1px solid #dbdbdb; color: #808080; padding:5px 11px; } h2 { width:80%; color:#ec91d8; font-family:"Lucida Sans", "Trebuchet MS", Verdana, Helvetica, sans-serif; font-size:1.3333em/*16px*/; letter-spacing:0.05em; text-align:right; text-transform:uppercase; font-style:normal; font-weight:bold; } /*****CALENDAR PAGE *******************/ ul.year{ list-style:none; text-align:center; margin-left:auto; margin-right:auto; padding: 10px 10px 10px 10px; } ul.year li { color:#808080; display: inline; } ul.year li.active { color:#ec91d8;; font-size:1.1538em/*15px*/; font-weight:bold; } table.yeartable { margin-left:auto; margin-right:auto; padding:3px; border:1px solid #dbdbdb; background:#f9f9f9; } table.yeartable td.yeardate, table.yeartable td.yearday { color: #808080; border:1px solid #dbdbdb; } table.yeartable td.yearday { background:#ccc; text-align: center; } td.yearmonth { color:#999; } /*****CLEARS, SKIPLINKS ***********************/ .clear{ height:0; background:transparent;} .clearfoot { clear: both; height:0; background:transparent; } .separator { height:1px; background:#f9f9f9; } .skiplinks { text-transform:none; text-align:center; margin:auto; padding:10px; color:#4ac87b; border:1px solid #dbdbdb; width:80%; background:#f9f9f9; } /*****COMMENTS VIEW *******************/ .datesubjectcomment { background:#f0f0f0; padding:5px; } .userpiccomment { background:#f9f9f9; border:1px solid #f0f0f0; padding:5px; position:relative; padding:5px; margin:-20 10px 10px 10px; z-index:15; float:left; } .box { font-size:1em/*13px*/; padding:10px; clear:right; } input, textarea { background-color:#fff; color:#808080; } textarea.textbox { width:95%!important; } .reply{ position:relative; margin:5px; padding:5px; text-align:left; background-color:#fff; color:#808080; } .replytosubject { font-weight:normal; } .commentreply { position:relative; padding:5px; color:#808080; } .commentbox { border:1px solid #f0f0f0; padding:10px; margin:10px; background-color:#fff; } .datesubjectcomment a:link, .datesubjectcomment a:visited { color:#4ac87b; } .datesubjectcomment a:hover { color:#ec91d8; } .commentboxpartial { border:1px solid #f0f0f0; padding:10px; margin:10px; background-color:#fff; } .commentinfo { background-color:#fff; margin-top:10px; width: 100%; } #qrform table { border:1px solid #fff !important; height:auto; } /*****LJ-USER / COMMUNITY / PROTECTED ICONS icons by http://passing_girl.livejournal.com/ and http://www.icojoy.com/ ***************************************/ .ljuser img { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-user-gray.gif) no-repeat; padding: 16px 12px 0 0!important; } .ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-user-gray.gif) no-repeat; padding: 16px 12px 0 0!important; } .ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-group-gray.gif) no-repeat; padding: 16px 16px 0 0!important; } .entry img[src="http://p-stat.livejournal.com/img/icon_protected.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } #sidebar_summary img[src="http://p-stat.livejournal.com/img/icon_protected.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } .subject img[src="http://p-stat.livejournal.com/img/icon_protected.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } .entry img[src="http://p-stat.livejournal.com/img/icon_private.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } .subject img[src="http://p-stat.livejournal.com/img/icon_private.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } #lj_controlstrip .ljuser img { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-user-gray.gif) no-repeat; padding: 16px 12px 0 0!important; } #lj_controlstrip .ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-user-gray.gif) no-repeat; padding: 16px 12px 0 0!important; } #lj_controlstrip .ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-group-gray.gif) no-repeat; padding: 16px 16px 0 0!important; } /*****CONTEXTUAL POPUP ***************************************/ div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { background:#fff!important; border:1px solid #999!important; color:#808080!important; font-family:"Trebuchet MS", Verdana, Arial, Helvetica, sans-serif font-size:1em; font-weight:100!important; padding:5px; } div.ContextualPopup .Content { font-weight:100!important; margin-right:50px; } div.ContextualPopup .Relation { font-size:1.2727em/*14px*/; font-weight:100!important; } div.ContextualPopup .Content .OnlineStatus {font-weight:100!important;} div.ContextualPopup .Userpic {font-weight:100!important;} div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited { color:#999!important; font-family:"Trebuchet MS", Verdana, Arial, Helvetica, sans-serif font-weight:100; text-decoration:none!important; } div.ContextualPopup div.Inner a:hover{ color:#999!important; font-family:"Trebuchet MS", Verdana, Arial, Helvetica, sans-serif font-weight:100; text-decoration:underline!important; }

Live preview | Image preview
/********************DO NOT REMOVE THIS******************** Layout 002 [Vintage 2.0] by Yam @ Frozen Mint (frozen_mint.livejournal.com) Style: Flexible Squares Account level: Basic / Paid / Plus Tested on: IE (6 and higher), Firefox, Safari and Chrome ************************************************************/ /*****BASICS ************/ body { background:#4ac87b; font-family:"Trebuchet MS", Verdana, Helvetica, sans-serif; color:#808080; font-size:100%; } a, a:link, a:visited { color:#ec91d8; text-decoration:none; text-transform:none; } a:hover { color:#4ac87b; text-decoration:underline; } blockquote { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/head-pink.png) top left repeat-x; border:1px solid #ec91d8; color:#808080; text-align:left; margin:auto; padding:10px; width:95%; } p, td { font-size:inherit; } code, kbd, pre, tt { font-family:monospace; } ::-moz-selection { background:#4ac87b; color: #666; } b, strong{ font-weight:bold; color:#ec91d8;} i, em{ font-style:italic;} .ippu {font-size:11px;} a{outline:none;} a img{border:0;} /*****LAYOUT ************/ #header { font-family:"Lucida Sans", "Trebuchet MS", Verdana, Helvetica, sans-serif; background-color:#f9f9f9; margin:0; padding:15px 10px; text-align:left; width:auto; } #content { background:#f9f9f9; border:1px solid #cacaca; width:850px; margin-left:auto; margin-right:auto; margin-top:30px; padding: 0px; height:100%; } #sidebar { background:#f9f9f9; font-size:0.6875em/*11px*/; float:left; margin: 0 0 10px 0; padding: 0 15px 5px 15px; text-align: left; width: 200px; } #maincontent { background:#f9f9f9; margin: 0 0 0 240px; font-size:0.75em/*12px*/; } #footer { font-family:"Lucida Sans", "Trebuchet MS", Verdana, Helvetica, sans-serif; background-color:#f9f9f9; margin:auto; padding:15px 10px; text-align:left; } /*****HEADER ************/ ul.navheader { padding:0; margin:0; } ul.navheader li { display:inline; list-style:none; padding:0; margin:0; } #header li.view { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/head-green.png) top left repeat-x; border:1px solid #4ac87b; color:#808080; font-size:0.75em/*12px*/; letter-spacing:0.1em; text-transform:uppercase; text-decoration:none; margin:0; padding:5px 10px; } #header a, #header a:link, #header a:visited { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/head-pink.png) top left repeat-x; border:1px solid #ec91d8; color:#808080; font-size:0.75em/*12px*/; letter-spacing:0.1em; text-transform:uppercase; margin:0; padding:5px 10px; } #header a:hover { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/head-green.png) top left repeat-x; border:1px solid #4ac87b; color:#7a7979; font-size:0.75em/*12px*/; letter-spacing:0.1em; text-transform:uppercase; text-decoration:none; margin:0; padding:5px 10px; } .title, .subtitle { display:none; } /*****SIDEBAR *************/ div#sidebar a, div#sidebar a:link, div#sidebar a:visited { color:#666; text-decoration:none; text-transform:uppercase; } div#sidebar a:hover { color:#ec91d8; text-decoration:none; } .sbarbody { padding:0; margin:0; } .sbarbody2 { background-color:#f9f9f9; padding:0; } .defaultuserpic { display:none; margin:auto; text-align:center; } table.calendar { margin:auto; width:100%; } .sbarcalendar { background:#fff; border:1px solid #dbdbdb; color: #808080; font-size:1em/*12px*/; padding:1px; text-align:center; } .sbarcalendarposts { background:#cacaca; border:1px solid #cacaca; font-size:1em/*12px*/; padding:1px; text-align:center; } .sbarcalendarposts a, .sbarcalendarposts a:link, .sbarcalendarposts a:visited{ color:#fff!important; } .sbarcalendarposts a:hover{ color:#fff; text-decoration: underline!important; } ul.sbarlist { list-style:none; margin:0; padding:0; } li.sbaritem { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/head-gray.png) top left repeat-x; border: 1px solid #dbdbdb; color:#666; text-decoration:none; text-transform:none; text-align:left; padding:5px; margin:2px; } #sidebar_linklist li.sbaritem a, #sidebar_tags li.sbaritem a{ display:block; } #sidebar_linklist li.sbaritem:hover, #sidebar_tags li.sbaritem:hover{ display:block; background:#f9f9f9; border:1px solid #cacaca; color:#666; } #sidebar_summary li.sbaritem { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/head-gray.png) top left repeat-x; border: 1px solid #dbdbdb; display:block; color:#666; text-decoration:none; text-transform:none; text-align:left; padding:5px; margin:2px; } #sidebar_summary li.sbaritem:hover{ display:block; background:#f9f9f9; border:1px solid #cacaca; color:#666; } li.sbartitle { list-style:none; color:#808080; font-size:1.1818em/*13px*/; margin:15px 0 0 0; padding:0; text-align:left; text-transform:uppercase; } /*ul.ljtaglist li {list-style: none;} .sbarheader {}*/ /*****FOOTER ************/ ul.navfooter { padding:0; margin:auto; } ul.navfooter li { display:inline; list-style:none; padding:0; margin:auto; } #footer li.viewing { background-color:#f9f9f9; color:#808080; font-size:0.75em/*12px*/; letter-spacing:0.1em; text-transform:uppercase; text-decoration: none; margin:5px; padding:5px; } #footer a, #footer a:link, #footer a:visited { background-color:#f9f9f9; color:#ec91d8; font-size:0.75em/*12px*/; letter-spacing:0.1em; text-transform:uppercase; margin:5px; padding:5px; } #footer a:hover { background-color:#f9f9f9; color:#4ac87b; font-size:0.75em/*12px*/; letter-spacing:0.1em; text-transform:uppercase; text-decoration:underline; margin:5px; padding:5px; } /*****ENTRY ***********/ .subcontent { background:#f9f9f9; border-left:1px solid #f0f0f0; margin:5px; padding:5px; } .entry{ color:#808080; margin:0; padding:5px; text-align:left; } .entry ul li { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/entry-li-arrow.gif) left no-repeat; list-style:none; margin-left:10px; padding-left:11px; color:#808080; } .entry ol li { list-style:lower-roman; margin-left:30px; padding-left:0px; color:#808080; } /*****USERPICS **************/ .userpic, .userpicfriends { background:#fff!important; border: 1px solid #dbdbdb; font-size:0.7692em/*10px*/; text-align:center; text-transform:lowercase; color:#ec91d8; float:right; margin:0 15px 15px 15px; padding:5px; position:relative; z-index:15; } .userpicfriends font{ font-size:1em/*10px*/; text-align:center; text-transform:lowercase; color:#808080; } .userpic a, .userpic a:link, .userpic a:visited, .userpicfriends a, .userpicfriends a:link, .userpicfriends a:visited, userpicfriends font{ color:#808080!important; text-decoration: none; text-transform:lowercase; } .userpic a, .userpicfriends a:hover, userpicfriends a:hover font { color:#808080!important; text-decoration:underline; text-transform:lowercase; } /*.userpicfriends br {}*/ /*****DATE, SUBJECT, CURRENTS GENERAL, COMMENTS, TAGS ***************************************/ .date{ border:0px; color:#808080; font-size:0.9166em/*11px*/; text-align:left; text-transform:lowercase; } .subject { color:#4ac87b; font-family:"Lucida Sans", "Trebuchet MS", Verdana, Helvetica, sans-serif; font-size:1.3333em/*16px*/; text-align:left; text-transform:uppercase; font-style:normal; font-weight:bold; border-bottom:1px solid #dbdbdb; } .subject a, .subject a:link, .subject a:visited { color:#4ac87b; text-transform:uppercase; font-style:normal; font-weight:bold; } .subject a:hover { color:#4ac87b; text-decoration:underline; } .datesubject { background-color:#f9f9f9; padding:10px; } .ljtags { border-left:2px solid #4ac87b; padding-left:5px; text-align:left; margin-top:10px; color:#808080; font-size:0.9166em/*11px*/; font-weight:normal; } .currents{ border-left:2px solid #4ac87b; padding-left:5px; text-align:left; color:#808080; font-size:0.9166em/*11px*/; } .currents strong, .ljtags strong { color:#808080; font-weight:normal; } .ljtags a, .ljtags a:link, .ljtags a:visited, .currents a, .currents a:link, .currents a:visited { color:#ec91d8; font-weight:normal; } .ljtags a:hover, .currents a:hover { color:#4ac87b; text-decoration:underline; } .comments { border-left:2px solid #4ac87b; padding-left:5px; position: relative; background:#f9f9f9; color:#4ac87b; font-family:"Lucida Sans", "Trebuchet MS", Verdana, Helvetica, sans-serif; font-size:1em/*12px*/; letter-spacing:0.05em; text-align:left; text-transform:uppercase; font-style:normal; font-weight:bold; margin-bottom:10px; } .comments a, .comments a:link, .comments a:visited { color:#ec91d8; text-transform:uppercase; } .comments a:hover { color:#4ac87b; text-decoration:underline; } /*****TAGS PAGE **************/ .ljtaglist { width:80%; list-style:none; color:#808080; border-left: 1px solid #f0f0f0; } .ljtaglist li { background:#f9f9f9 url(http://www.mentahelada.net/lj-layouts/layout002/entry-li-arrow.gif) left no-repeat; border-bottom: 1px solid #dbdbdb; color: #808080; padding:5px 11px; } h2 { width:80%; color:#4ac87b; font-family:"Lucida Sans", "Trebuchet MS", Verdana, Helvetica, sans-serif; font-size:1.3333em/*16px*/; letter-spacing:0.05em; text-align:right; text-transform:uppercase; font-style:normal; font-weight:bold; } /*****CALENDAR PAGE *******************/ ul.year{ list-style:none; text-align:center; margin-left:auto; margin-right:auto; padding: 10px 10px 10px 10px; } ul.year li { color:#808080; display: inline; } ul.year li.active { color:#4ac87b;; font-size:1.1538em/*15px*/; font-weight:bold; } table.yeartable { margin-left:auto; margin-right:auto; padding:3px; border:1px solid #dbdbdb; background:#f9f9f9; } table.yeartable td.yeardate, table.yeartable td.yearday { color: #808080; border:1px solid #dbdbdb; } table.yeartable td.yearday { background:#ccc; text-align: center; } td.yearmonth { color:#999; } /*****CLEARS, SKIPLINKS ***********************/ .clear{ height:0; background:transparent;} .clearfoot { clear: both; height:0; background:transparent; } .separator { height:1px; background:#f9f9f9; } .skiplinks { text-transform:none; text-align:center; margin:auto; padding:10px; color:#ec91d8; border:1px solid #dbdbdb; width:80%; background:#f9f9f9; } /*****COMMENTS VIEW *******************/ .datesubjectcomment { background:#f0f0f0; padding:5px; } .userpiccomment { background:#f9f9f9; border:1px solid #f0f0f0; padding:5px; position:relative; padding:5px; margin:-20 10px 10px 10px; z-index:15; float:left; } .box { font-size:1em/*13px*/; padding:10px; clear:right; } input, textarea { background-color:#fff; color:#808080; } textarea.textbox { width:95%!important; } .reply{ position:relative; margin:5px; padding:5px; text-align:left; background-color:#fff; color:#808080; } .replytosubject { font-weight:normal; } .commentreply { position:relative; padding:5px; color:#808080; } .commentbox { border:1px solid #f0f0f0; padding:10px; margin:10px; background-color:#fff; } .datesubjectcomment a:link, .datesubjectcomment a:visited { color:#ec91d8; } .datesubjectcomment a:hover { color:#4ac87b; } .commentboxpartial { border:1px solid #f0f0f0; padding:10px; margin:10px; background-color:#fff; } .commentinfo { background-color:#fff; margin-top:10px; width: 100%; } #qrform table { border:1px solid #fff !important; height:auto; } /*****LJ-USER / COMMUNITY / PROTECTED ICONS icons by http://passing_girl.livejournal.com/ and http://www.icojoy.com/ ***************************************/ .ljuser img { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-user-gray.gif) no-repeat; padding: 16px 12px 0 0!important; } .ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-user-gray.gif) no-repeat; padding: 16px 12px 0 0!important; } .ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-group-gray.gif) no-repeat; padding: 16px 16px 0 0!important; } .entry img[src="http://p-stat.livejournal.com/img/icon_protected.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } #sidebar_summary img[src="http://p-stat.livejournal.com/img/icon_protected.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } .subject img[src="http://p-stat.livejournal.com/img/icon_protected.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } .entry img[src="http://p-stat.livejournal.com/img/icon_private.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } .subject img[src="http://p-stat.livejournal.com/img/icon_private.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important; } #lj_controlstrip .ljuser img { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-user-gray.gif) no-repeat; padding: 16px 12px 0 0!important; } #lj_controlstrip .ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-user-gray.gif) no-repeat; padding: 16px 12px 0 0!important; } #lj_controlstrip .ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout002/icon-group-gray.gif) no-repeat; padding: 16px 16px 0 0!important; } /*****CONTEXTUAL POPUP ***************************************/ div.ContextualPopup img { border:0 none; } div.ContextualPopup div.Inner { background:#fff!important; border:1px solid #999!important; color:#808080!important; font-family:"Trebuchet MS", Verdana, Arial, Helvetica, sans-serif font-size:1em; font-weight:100!important; padding:5px; } div.ContextualPopup .Content { font-weight:100!important; margin-right:50px; } div.ContextualPopup .Relation { font-size:1.2727em/*14px*/; font-weight:100!important; } div.ContextualPopup .Content .OnlineStatus {font-weight:100!important;} div.ContextualPopup .Userpic {font-weight:100!important;} div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited { color:#999!important; font-family:"Trebuchet MS", Verdana, Arial, Helvetica, sans-serif font-weight:100; text-decoration:none!important; } div.ContextualPopup div.Inner a:hover{ color:#999!important; font-family:"Trebuchet MS", Verdana, Arial, Helvetica, sans-serif font-weight:100; text-decoration:underline!important; }

Image preview

To add the striped background, find this part of the code:
body {
background:#eb8fd7;
font-family:"Trebuchet MS", Verdana, Helvetica, sans-serif;
color:#808080;
font-size:100%;
}
And change the "background" line to: background:#eb8fd7 url('http://www.mentahelada.net/lj-layouts/layout002/bg-stripe-gray.png') top left repeat fixed;

Image preview

To add the striped background, find this part of the code:
body {
background:#4ac87b;
font-family:"Trebuchet MS", Verdana, Helvetica, sans-serif;
color:#808080;
font-size:100%;
}
And change the "background" line to: background:#4ac87b url('http://www.mentahelada.net/lj-layouts/layout002/bg-stripe-gray.png') top left repeat fixed;
LAYOUT INFO:
  • Style: Flexible Squares
  • Account level: Basic, Paid, Plus
  • Tested on: IE (6 and higher), Firefox Safari and Chrome.

IMAGES:
Please upload the images to your own server. Thanks.
Background of header and sidebar items:
,
,

User, community, locked/protected icons:


(by Passing Girl),
(by Icojoy)
List item:

Pride & Prejudice icon in the live preview made by me. Find it here.
BASIC INSTRUCTIONS:
  1. Choose a Flexible Squares layout
  2. Go to Customize Journal Theme
  3. Select NO in the dropdowns
  4. Leave "Custom External Stylesheet" empty
  5. Paste the CSS that I give you in the "Custom Stylesheet" box
  6. Save.
  • Make changes if you know how (but still credit me!)
  • Ask if you have doubts, I'll try to answer asap

ADDING A HEADER:

If you want a header in yout layout, add this at the end of the code:
.headerimage {
position:relative;
margin:0 auto;
background-repeat:no-repeat;
background-image:url('ADD HERE YOUR URL');
width:0px;
height:0px;
}
And change the url to your own. Also, change the width and height lines so they fit your image size.

EASY RULES:
  • Credit frozen_mint if you use. Please don't credit mintyapple, please change the credit you have in your userinfo. Thanks!
  • Comment if you like / if you take

maker: yam, style: flexible squares

Previous post Next post
Up